:root{
    --fantasy-orange: #FF5E00;
    --fantasy-orange-75: rgba(255, 94, 0, 0.75);
}
body.dark-bg{
    background: url("/public/img/dark_background.png");
    background-repeat: repeat;
    background-size: 250px;
    color:white;
}
body.darkest-bg{
    background: url("/public/img/dark_background.png");
    background-repeat: repeat;
    background-size: 250px;
    color:white;
    backdrop-filter: brightness(0.5);
}
a.button{
    border:none;
}
@media screen and (max-width:1400px) {
    body{
        min-height: calc(100vh - 8em);
    }
}
.align-center{
    text-align: center;
}
.flex-center{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.flex-between{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 1em;
    align-items: center;
}
fantasy-header{
    display: block;
    padding:1em 2em;
    padding-bottom: 70px;
    margin-bottom: 70px;
    background-image: url("/public/img/fantasy_pngwing.png");
    background-size: 100% 100%;
    /* background-repeat: no-repeat; */
    background-position: bottom;
    background-repeat: repeat-x;
    position: relative;

    text-transform: uppercase;
}
fantasy-header::before{
    content: "";
    background-image: url("/public/img/paper_bg.png");
    background-size: 100% 100%;
    /* background-color: red; */
    position: absolute;
    width: 100%;
    height: calc(100% - 40px);
    top:0px;
    left:0px;
    z-index: -1;
}
fantasy-header::after{
    content: "";
    background-image: url("/public/img/paper_header.png");
    background-size: 100% auto;
    background-position: bottom center;
    /* background-color: red; */
    position: absolute;
    width: 100%;
    height: 140px;
    bottom: -92px;
    left:0px;
    z-index: -2;
}
fantasy-header .h-row{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    position: relative;
}

fantasy-header .h-row a.fl_header_baner{
    position: absolute;
    bottom: 0px;
    right:5vw;
    width: 25vw;
    height:150px;
    display: block;
}
fantasy-header .h-row img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

@media screen and (max-width:1400px) {

    fantasy-header .h-row a.fl_header_baner{
        position: absolute;
        bottom: -83px;
        right: 5vw;
        width: 35vw;
        height: 100px;
        display: block;
    }
}
fantasy-header .imgs{
    display: flex;
    flex-direction: row-reverse;
    justify-content: left;
}
fantasy-header .imgs .cup{
    position: absolute;
    top: 100%;
    left: 2.5em;
    width: fit-content;
}

fantasy-header .imgs .cup img{
    height: 6em;
    width: fit-content;
}
fantasy-header .imgs a{
    max-width: 79%;
    text-decoration: none;
}
fantasy-header .imgs img{
    height: 200px;
    width: 100%;
    object-fit: contain;
}
@media screen and (min-width:1400px) {
    fantasy-header .imgs img{
        max-width: 33vw;
    }
}
fantasy-header .navs{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    height: auto;
    font-weight: bold;
}
fantasy-header .navs a{
    display: inline-block;
    padding:0.5em;
    border-radius: 54px;
    font-size: 18px;
    line-height: 1em;
    min-width: calc(1em + 2px);
    /* min-height: 1em; */
    height:1em;
    text-align: center;
    position: relative;
    transition: all 0.25s ease-in-out;
    cursor: pointer;
    text-decoration: none;
}
@media screen and (max-width: 1600px) {
    fantasy-header .navs a{
        font-size: 15px;
    }
}
fantasy-header .navs a:not(:first-child){
    margin-left: 2em;
}
fantasy-header .navs a:not(.profile){
    background-color: transparent;
    border: 2px solid var(--color-orange);
    /* color: var(--color-orange); */

    background: -webkit-linear-gradient(0deg, #A14B2E, #CF6020);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
fantasy-header .navs a img{
    /* display: block; */
    position: absolute;
    top:2px;
    left:2px;

    width: 100%;
    height:100%;
    transition: all 0.25s ease-in-out;
}
fantasy-header .navs a:not(.profile).active{
    background: linear-gradient(0deg ,#DE643B, #FF5F02);
    -webkit-text-fill-color: white;
    border: 2px solid var(--color-orange);
    color: white;
}
fantasy-header .navs a.profile.active img,
fantasy-header .navs a.profile:hover img{
    transform: scale(1.25);
}
fantasy-header .colab-text{
    text-align: left;
    color:black;
}
fantasy-header .colab-text > span{
    display: flex;
    flex-direction: row;
    align-items: center;
    font-weight: bold;
    text-decoration: none;
    color:black;
}
fantasy-header .colab-text > span > span{
    text-decoration: none;
    color:black;
}
fantasy-header .colab-text > span span:nth-child(1){
    font-size: 22px;
}
fantasy-header .colab-text > span span:nth-child(2){
    margin: 0px 1em;
    font-size: 12px;
}
fantasy-header .colab-text > span span:nth-child(3){
    font-size: 12px;

    line-height: 1em
}

.fantasy h1{
    padding:1em;
    font-size: 3em;
    margin:0px;
    line-height: 1em;
    padding-top: 0px;
}
.fantasy div.dark{
    background-color: rgba(0, 0, 0, 0.342);
    padding: 1em 3em;
}

.fantasy .team{
    display: flex;
    flex-direction: row;
    gap: 20px;
}
.fantasy .team .left-side{
    width: 33%;
    display: flex;
    flex-direction: column;
    gap: 2em;
}
.fantasy .team .right-side{
    width: 60%;
}

/* .fantasy .team .field{
} */
.fantasy .team .field > div{
    height: calc((100vw - 2em) * 0.3 / 0.75);
    background-image: url(/public/img/field.png?v=2);
    background-size: 100% 100%;
    padding-top:4%;
    padding-bottom:1%;
    box-sizing: border-box;

    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.fantasy .team .field  > div > div{
    display: flex;
    flex-direction: row;
    padding:0px 8%;
    height:100%;
}
@media screen and (max-width: 1400px) {
    .fantasy .team .field > div > div{
        height: 22%;
    }
}
.fantasy .team .field #fieldline-2{
    margin-top: 2%;
}
.fantasy #fieldline-4{
    justify-content: space-around;
}
.fantasy #fieldline-3{
    padding:0px 10%;
    justify-content: space-around;
}
.fantasy #fieldline-2{
    justify-content: space-between;
}
.fantasy #fieldline-1{
    justify-content: center;
}

.fantasy .team .field > div .field-card.disabled {
    opacity: 0.5;
}

.fantasy .team .field > div .field-card{
    width: calc((100vw - 2em) * 0.3 / 5);
    position: relative;
}
.fantasy .team .field.penta > div .field-card{
    transform: scale(0.9);
}

.fantasy .team .field  > div .field-card img.cross{
    position: absolute;
    right:0em;
    top:-0.25em;
    width: 1.5em;
    height: 1.5em;

    z-index: 5;
    background-color: white;
    border-radius: 100%;

    object-fit: contain;
    transition: all 0.15s linear;

    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                        supported by Chrome, Edge, Opera and Firefox */
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}
.fantasy .team .field  > div .field-card .info{
    position: absolute;
    right:-2.5em;
    top: -0.9em;
    width: 3em;
    height: 3em;

    z-index: 5;
    border-radius: 100%;

    object-fit: contain;

    background-image: url("/public/img/information.png");
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;

    transition: all 0.15s linear;

    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                        supported by Chrome, Edge, Opera and Firefox */
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}
.fantasy .team .field  > div .field-card .info:hover,
.fantasy .team .field  > div .field-card img.cross:hover{
    transform: scale(1.1);
}

.fantasy .team .field  > div .field-card.best::before{
    content: "";
    position: absolute;
    left:0em;
    top:-0.25em;
    width: 1.5em;
    height: 1.5em;
    z-index: 10;
    background-image: url("/public/img/fl_star.svg");
    background-size: 1.5em 1.5em;
    background-position: center;
    background-repeat: no-repeat;
}

.fantasy .team .field  > div .field-card .img{
    position: relative;
    height:calc(100% - 3em);
}
.fantasy .team .field > div .field-card .img img:nth-child(1){
    width: 100%;
    height:100%;
    object-fit: cover;
}
.fantasy .team .field > div .field-card.shirt .img img:nth-child(1){
    width: 100%;
    height:100%;
    object-fit: contain;
}
.fantasy .team .field  > div .field-card .img img{
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                        supported by Chrome, Edge, Opera and Firefox */
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

.fantasy .team .field  > div .field-card .img img:nth-child(2){
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    width:50%;
    height:50%;
    object-fit: contain;
}

.fantasy .team .field  > div .field-card p{
    margin:0px;
    width: fit-content;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.fantasy .team .field  > div .field-card p.name{
    color:black;
    font-weight: bold;
    text-shadow: 0px 0px 20px #ffffff,
    0px 0px 20px #ffffff,
    0px 0px 20px #ffffff,
    0px 0px 20px #ffffff,
    0px 0px 20px #ffffff,
    0px 0px 20px #ffffff,
    0px 0px 20px #ffffff,
    0px 0px 20px #ffffff,
    0px 0px 20px #ffffff;
    font-size: 12px;
    position: relative;
    z-index: 2;
    text-transform: uppercase;
}
.fantasy .team .field  > div .field-card p.name a{
    color:black;
    text-decoration: none;
}
.fantasy .team .field.penta > div .field-card p.name{
    font-size: 10px;
}
.fantasy .team .field  > div .field-card p.score{
    background-color: #EF9763;
    border-radius: 2em;
    padding:0.05em 0.5em;
    position: relative;
    z-index: 2;
}
.fantasy .team .field  > div .field-card.captain p.score::before{
    content: "К";
    position: absolute;
    left:-2em;
    top:50%;
    box-sizing: content-box;
    transform: translateY(-50%);
    font-weight: bold;
    width:1em;
    height:1em;
    padding:0.2em 0.2em 0.2em 0.2em;
    background-color: #F04F39;
    border:1px solid white;
    border-radius: 100%;
}

.fantasy .team .tours{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

.fantasy .team .tours #tours-list{
    width: calc(100% - 6em);
    height:10em;
    white-space: nowrap;
    overflow: hidden;
    /* display: flex;
    flex-direction: row;
    justify-content: space-between; */
}
.fantasy .team .tours #tours-list .tour-item{
    width: calc(33% - 0.5em);
    background-color: rgba(0, 0, 0, 0.342);
    box-sizing: border-box;
    padding: 1em;
    text-align: center;

    display: inline-flex;
    flex-direction: column;
    justify-content: space-between;

    text-transform: uppercase;

    transition: background-color 0.15s linear, margin-left 0.15s linear;

    color: white;
    text-decoration: none;
}
.fantasy .team .tours #tours-list .tour-item:not(:last-child){
    margin-right: 1em;
}
.fantasy .team .tours #tours-list .tour-item.active{
    background-color: var(--fantasy-orange-75);
}
.fantasy .team .tours #tours-list .tour-item p{
    font-size: 24px;
    line-height: 2.5em;
    border-bottom: 3px solid white;
    margin: 0px;
    font-weight: 600;
}
.fantasy .team .tours #tours-list .tour-item span{
    font-size: 48px;
    font-weight: bold;
}
.fantasy .team .tours .arrow{
    background-image: url("/public/img/arrow_colored.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 75% auto;
    cursor: pointer;
    height:10em;
    width:2em;

    /* transition: all 0.15s linear; */
}
/* .fantasy .team .tours .arrow:hover{
    background-size: 100% auto;
} */
.fantasy .team .tours .arrow.inverted{
    transform: rotate(180deg);
}


.fantasy .team .stats{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    text-align: center;
    height:10em;
    align-items: center;
}
.fantasy .team .stats > div > span{
    font-size: 48px;
    font-weight: bold;
}

.fantasy .team .stats > div > p{
    margin: 0px;
    opacity: 0.64;
    font-weight: 500;
}
.fantasy .team .filter form{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-bottom: 2em;
}

@media screen and (max-width: 1800px) {
    .fantasy .team .filter form{
        font-size: 0.75em;
    }
}
@media screen and (max-width: 1400px) {
    .fantasy .team .filter form{
        font-size: 1em;
    }
}

.fantasy .team .table table{
    width: 100%;
    border-collapse: collapse;
    font-size: 1em;
    text-transform: uppercase;
}
.fantasy .team .table label input{
    display: none;
}
.fantasy .team .table * > .checkmark{
    display: block;
    width: 2em;
    height: 2em;

    background-image: url("/public/img/fantasy_plus.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;

    cursor: pointer;
}
.fantasy .team .table *.checked > .checkmark{
    background-image: url("/public/img/fantasy_cross.svg");
}
.fantasy .team .table table th{
    text-align: center;
}
.fantasy .team .table table th:first-child{
    text-align: left;
    padding-left: 1em;
}

.fantasy .team .table table th.sortable{
    cursor: pointer;
}
.fantasy .team .table table th.sortable a{
    color:white;
    text-decoration: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}
.fantasy .team .table table th:first-child a{
    justify-content: start;
}
.fantasy .team .table table th.sortable a::after{
    content: "";
    width: 1em;
    height: 1em;
    display: inline-block;
    margin-left: 0.25em;
    /*background-image: url(/public/img/sort_asc.svg);*/
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}
.fantasy .team .table table th.sortable.asc a::after{
    background-image: url("/public/img/sort-asc.svg");
}
.fantasy .team .table table th.sortable.desc a::after{
    background-image: url("/public/img/sort-desc.svg");
}
.fantasy .team .table table tr:first-child th{
    padding-bottom: 0.5em;
}
.fantasy .team .table table tr:not(:first-child){
    background-color: rgba(0, 0, 0, 0.34);
}
.fantasy .team .table table tr{
    border-bottom: 4px solid #474747;
}
.fantasy .team .table table td img{
    width: 2em;
    height:2em;
    transform: translateY(4px);
}
.fantasy .team .table table td{
    text-align: center;
}
.fantasy .team .table table td:first-child{
    text-align: left;
    padding-left: 1em;
    width: 33%;
}
.fantasy .team .table table td .fio{
    color: #fff;
    text-decoration: none;
}
.fantasy .team .table table td:first-child .info{
    display: inline-block;
    margin-left: 0.25em;
    width: 18px;
    height: 18px;
    background-image: url("/public/img/information_white.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 18px;
    margin-bottom: 0;
    filter:brightness(0.75);
    transition: all 0.15s linear;
    text-decoration: none;
}
.fantasy .team .table table td:first-child .info:hover{
    filter:brightness(1);
}
.fantasy .team .controls{
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-top: 1em;
}
.fantasy .team .controls .arrow{
    background-image: url("/public/img/table_arrow.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% auto;
    cursor: pointer;
    height:2em;
    width:2em;
}
.fantasy .team .controls .arrow.inverted{
    transform: rotate(180deg);
}
.fantasy .team .controls .pages{
    font-size: 1.5em;
    margin:0 1em;
}
.fantasy .team .controls .pages a{
    padding:0 0.25em;
    cursor: pointer;
    text-decoration: none;
    color:white;
}
.fantasy .team .controls .pages a:hover{
    text-shadow: 0 0 5px #ffffff;
}

.fantasy .team .controls .pages a.active {
    color: var(--color-orange);
}

.fantasy .field-buttons{
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    margin-top: 2em;
    align-items: center;
    font-size: 0.75em;
}
.fantasy .field-buttons > div select{
    width: 100%;
}
@media screen and (max-width:1400px){
    .fantasy .team .table * > .checkmark{
        font-size: 1.5em;
        margin-bottom: 0.25em;
        margin-top: 0.25em;
    }
    .fantasy .field-buttons > div:first-child{
        width:50%;
    }
    .fantasy .field-buttons > div select{
        max-width: unset;
    }
    .fantasy .field-buttons > div:first-child .pc-hide input[type="button"]{
        width: 100%;
    }
}
.fantasy input[type="submit"],
.fantasy input[type="button"],
a.profile-button{
    background: linear-gradient(90deg, #F49C63 0%, #DA7858 100%);
    color:white;
    text-transform: uppercase;
    border-radius: 54px;
    border: none;

    height:fit-content;

    font-weight: bold;
    font-size: 1.25em;
    padding:0.5em 2em;
    transition: all 0.15s linear;
}
.fantasy input[type="submit"]:active,
.fantasy input[type="button"]:active{
    filter: brightness(0.75);
}
.fantasy input[type="submit"]:disabled,
.fantasy input[type="button"]:disabled,
.fantasy input[type="submit"].disabled,
.fantasy input[type="button"].disabled{
    filter: brightness(0.5);
}
.fantasy select{
    max-width: 250px;

    font-size: 1.25em;
    padding:0.5em 2em;
    padding-right: 3em;
    border-radius: 1.25em;
    text-transform: uppercase;

    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    height:fit-content;

    color: white;
    border:none;

    box-shadow: 5px 5px 15px 2px #000000;

    background-color: #4A4B4B;

    background-image: url("/public/img/select_arrow.svg");
    background-repeat: no-repeat;
    background-position: right 1em center;
    background-size: 1.5em auto;

    outline: none;

    transition: border-radius 0.15s linear;
}
.fantasy .filter select,
.fantasy .filter > form > div:first-child{
    max-width: 25%;
}
.fantasy .filter > form > div:first-child > input[type="text"]{
    width: 100%;
    box-sizing: border-box;
}
@media screen and (max-width:1800px) {
    .fantasy .field-buttons{
        font-size: 1em!important;
    }
}
.fantasy select.bordered{
    border: 4px solid var(--color-orange);
    box-shadow: none;
}
.fantasy select.transparent{
    background-color: transparent;
}
.fantasy select.transparent option{
    background-color: var(--color-orange);
}
.fantasy select:hover{
    border-radius: 1.25em 1.25em 0px 0px;
}
.fantasy select::-ms-expand {
    display: none;
}
.fantasy input[type="text"]{
    font-size: 1.25em;
    padding:0.5em 2em;
    border-radius: 1.25em;
    background-color: rgba(0, 0, 0, 0.349);
    border: 4px solid var(--color-orange);
    color:white;
}
.fantasy .filter .price{
    margin-top: 0.5em;

    display: flex;
    flex-direction: row;
    justify-content: left;
    align-items: center;
}
.fantasy .filter .price input:nth-child(1){
    margin-left: 1em;
}
.fantasy .filter .price input[type="number"]{
    font-size: 1.25em;
    padding:0.5em 0.75em;
    border-radius: 1.25em;
    background-color: rgba(0, 0, 0, 0.349);
    border: 4px solid var(--color-orange);
    color:white;
    width:2em;
}
/* Chrome, Safari, Edge, Opera */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}
.fantasy .filter .price .price-line{
    border-bottom: 4px solid var(--color-orange);
    width: 1.5em;
    margin: 0px 0.5em;
}
.fantasy .filter input.search{
    background-image: url("/public/img/magnifier.png");
    background-repeat: no-repeat;
    background-size: 1em auto;
    background-position: left 0.5em center;
}

.fantasy .table#lineup{
    display: none;
}

.fantasy .tab-change{
    min-width: 33%;
    text-align: center;
    color:white!important;
}
.fantasy a.button.tab-change:not(.active){
    border-color: var(--color-orange);
    border: 2px solid var(--color-orange);
}
.fantasy .tab-change-container{
    margin-top: 1em;
    margin-bottom: 1em;
}

mobile-fantasy-header{
    display: none;

    justify-content: space-between;
    flex-direction: row;
    position: fixed;
    bottom: 0px;
    left:0px;
    width: 100%;
    height:8em;
    background-color: rgba(0, 0, 0, 0.65);

    z-index: 9998;
}
mobile-fantasy-header a{
    width: calc(25% - 0.25em);
    height:100%;
    text-decoration: none;
}
mobile-fantasy-header div{
    width: 100%;
    height:100%;
    background-color: #C45717;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
mobile-fantasy-header div.active{
    background-color: #FF7934;
}
mobile-fantasy-header div img{
    height:5em;
    width: 100%;
    object-fit: contain;
    object-position: center;
}
mobile-fantasy-header div span{
    display: block;
    margin-top: 0.5em;
    width: 100%;
    line-height: 1em;
    color:white;
    text-transform: uppercase;
    text-align: center;
}
@media screen and (max-width: 600px) {
    mobile-fantasy-header{
        height: 4em;
    }
    mobile-fantasy-header div img{
        height: 2.5em;
    }
    mobile-fantasy-header div span{
        font-size: 0.5em;
    }
}
.popup-search .cross{
    display: none;
}
.fantasy .team{
    min-height: 50vh;
}

@media screen and (max-width:2240px) {

    .fantasy .team .field.penta > div .field-card{
        transform: scale(0.9);
        width: calc((100vw - 2em) * 0.3 / 6);
    }
}

@media screen and (max-width:1400px) {
    body.fantasy{
        padding-bottom: 8em;
    }
    mobile-fantasy-header{
        display: flex;
    }
    .fantasy .table#lineup{
        display: block;
    }
    fantasy-header .navs{
        display: none;
    }
    .fantasy .team{
        flex-direction: column;
        align-items: center;
    }
    .fantasy .team .left-side,
    .fantasy .team .right-side{
        width: 100%;
    }
    .fantasy .team .left-side:not(.active),
    .fantasy .team .right-side:not(.active){
        display: none;
    }
    .fantasy .team .field > div{
        height: calc((100vw - 2em) / 0.75);
    }
    .fantasy .team .field > div .field-card{
        width:calc((100vw - 2em) / 6);
    }
    .fantasy .team .field.penta > div .field-card{
        width:calc((100vw - 2em) / 6);
    }

    .tab:not(.active){
        display: none;
    }

    .popup-search{
        position: fixed;
        top:0px;
        left:0px;
        width: 100%;
        height:100vh;
        z-index: 9999;
        display: flex;
        padding:2em;
        box-sizing: border-box;
        flex-direction: column;
        justify-content: center;

        background-color: white;
        background-image: url("/public/img/popup_bg.png"), url("/public/img/dark_background.png");
        /* background-image: ; */
        background-size: 100% 100%;
        /* background-repeat: ; */
    }
    .scoreboard .popup-search{
        position: relative;
    }
    .popup-search .cross{
        display: block;
        position: absolute;
        right: 1em;
        top:1em;
        width: auto;
        height:4em;
        object-fit: contain;
    }
    .popup-search:not(.active){
        display: none!important;
    }
    .fantasy .team .filter form{
        flex-wrap: wrap;
        align-items: center;
    }
    .fantasy .team .filter form > div:first-of-type{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        margin-bottom: 2em;
        max-width: 100%;
        gap: 1em;
    }
    .fantasy .team .filter form > div:last-of-type > span{
        font-size: 48px;
        font-weight: bold;
    }
    .fantasy .team .filter form > div:last-of-type > p{
        margin: 0px;
        opacity: 0.64;
    }
}

#rating-table{
    font-size: 1.5em;
}

.fantasy .team.scoreboard .right-side{
    max-width: 60%;
    width: fit-content;
}
.fantasy .team .table#rating-table{
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    overflow: auto;
}
#rating-table th,
#rating-table td{
    white-space: nowrap;
}
.fantasy .team .table#rating-table table th{
    padding:0.25em 1em;
    text-align: center;
}
.fantasy .team .table#rating-table table a{
    color: inherit;
    text-decoration: none;
}
.fantasy .team .table#rating-table table td{
    padding:0.25em 1em;
    text-align: center;
}
.fantasy .team .table#rating-table .fixed table th:nth-child(2),
.fantasy .team .table#rating-table .fixed table td:nth-child(2){
    text-align: left;
    padding:0px;
    padding-right: 1em;
}
.fantasy .team .table#rating-table table tr.head{
    background-color: var(--fantasy-orange-75);
}
.fantasy .team .table#rating-table table tr.first-place{
    background-color: #39dc674d;
}
.fantasy .team .table#rating-table table tr.second-place{
    background-color: #D3C4354d;
}
.fantasy .team .table#rating-table table tr.third-place{
    background-color: #F15A5A4d;
}
.fantasy .team .table#rating-table table tr.your-place{
    background-color: #b0a2a257;
}
.fantasy .team .field.view-only > div .field-card img.cross{
    display: none;
}
.fantasy .team .best-team{
    width: 100%;
    background-color: rgba(0, 0, 0, 0.336);
    padding: 1em;
}
.fantasy .team .best-team .title{
    color: white;
}
.fantasy .team .best-team .name{
    color: #DF643B;
    text-transform: uppercase;
}
.fantasy .team .best-team .score{
    color: #FFC19D;
}
.fantasy .team .best-team p{
    margin:0px;
    text-align: center;
    font-size: 1.5em;
    font-weight: bold;
}

.scoreboard-filter{
    width: 100%;
    background-color: var(--color-orange);
    margin-bottom: 1em;
    height:5em;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
}
.scoreboard-page-filter{
    margin-bottom: 1em;
}
.scoreboard-page-filter > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1em;
}
.scoreboard-filter select{
    font-size: 1.5em;
}

.scoreboard-filter .arrow{
    background-image: url("/public/img/scoreboard_filter_arrow.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% auto;
    cursor: pointer;
    height:4em;
    width:2em;

    /* transition: all 0.15s linear; */
}
/* .fantasy .team .tours .arrow:hover{
    background-size: 100% auto;
} */
.scoreboard-filter .arrow.inverted{
    transform: rotate(180deg);
}

.fantasy .team .table#rating-table {
    display: flex;
    flex-direction: row;
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    overflow-x: auto;
}

#rating-table .fixed{
    padding-bottom: 20px;
}
.fantasy .team .table#rating-table table.fixed td:first-child{
    width: 2em;
}
.fantasy .team .table#rating-table .scroll{
    width: fit-content;
    max-width: 100%;
    /* margin-left: auto;
    margin-right: auto; */
    overflow-x: auto;
}
.fantasy .team .table#rating-table .scroll::-webkit-scrollbar {
    width: 10px;
    height:20px;
}
.fantasy .team .table#rating-table .scroll::-webkit-scrollbar-track {
    background-color: rgba(169, 169, 169, 0.308);
    border-radius: 8px;
}
.fantasy .team .table#rating-table .scroll::-webkit-scrollbar-thumb {
    /* box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); */
    background-color: var(--fantasy-orange-75);
    border-radius: 8px;
}

@media screen and (max-width:1400px) {
    .fantasy .team.scoreboard .right-side{
        max-width: unset;
        width: 100%;
    }
    .fantasy .team .table#rating-table{
        width: 100%;
    }
    .fantasy .team .table#rating-table table th:not(.active),
    .fantasy .team .table#rating-table table td:not(.active){
        display: none;
    }
    .fantasy .team .table#rating-table table th:nth-child(1),
    .fantasy .team .table#rating-table table td:nth-child(1),
    .fantasy .team .table#rating-table table th:nth-child(2),
    .fantasy .team .table#rating-table table td:nth-child(2){
        display:table-cell;
    }

    #rating-table > div.fixed:first-child{
        width: 50%;
    }
    #rating-table > div.fixed:not(:first-child){
        width: 50%;
    }
    .fantasy .team .table#rating-table .scroll table th:not(.active),
    .fantasy .team .table#rating-table .scroll table td:not(.active){
        display: none;
    }
    #rating-table > div.scroll{
        width: 50%!important;
    }
}


.fantasy form.profile-input{
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5em;
}
.fantasy form.profile-input input[type="text"],
.fantasy form.profile-input input[type="password"],
.fantasy form.profile-input input[type="tel"],
.fantasy form.profile-input label{
    display: block;
    width: 100%;
    box-sizing: border-box;
    margin-top: 1em;
}
.fantasy form.profile-input input[type="checkbox"]{
    display: none;
}
.fantasy form.profile-input label{
    line-height: 2em;
    position: relative;
}
.fantasy form.profile-input label::before{
    content: "";
    background-image: url("/public/img/fantasy_unchecked.svg");
    background-size: 100% 100%;
    display: inline-block;
    width: 2em;
    height: 2em;
    margin-bottom: -0.6em;
    margin-right: 1em;
}
.fantasy form.profile-input input:checked + ::before{
    background-image: url("/public/img/fantasy_checked.svg");
}

.fantasy form.profile-input input[type="text"],
.fantasy form.profile-input input[type="password"],
.fantasy form.profile-input input[type="tel"]{
    font-size: 1.25em;
    background-color: white;
    color:rgba(0, 0, 0, 0.6);
    padding:0.5em 1em;
    border-radius: 0px;
    border: 4px solid #FF6A13;
    /* font-weight: 600; */
    outline: none;
}
.fantasy form.profile-input input[type="submit"],
.fantasy form.profile-input input[type="button"],
a.profile-button{
    margin-left: auto;
    margin-right: auto;
    margin-top: 1em;
    display: block;
}

.fantasy form.profile-input input[type="text"].invalid,
.fantasy form.profile-input input[type="password"].invalid,
.fantasy form.profile-input input[type="tel"].invalid{
    border-color: #EA0F0F;
    background-image: url("/public/img/fantasy_cross.svg");
    background-size: 1.5em 1.5em;
    background-position: right 0.5em center;
    background-repeat: no-repeat;
}
.fantasy form.profile-input .error{
    color:#FFC1C1;
    text-align: right;
    display: block;
    opacity: 0;
}
.fantasy form.profile-input .error.active{
    opacity: 1;
}

.fantasy.register div.dark{
    min-height: 50vh;
}

@media screen and (max-width:1400px) {

    .fantasy.register div.dark{
        background-color: transparent;
        min-height: calc(50vh - 8em);
    }
    body.fantasy.register{
        backdrop-filter: brightness(0.75);
    }
    .fantasy.register content{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}

.fantasy form.dark-container{
    max-width: 100%;
}

.fantasy div.dark-container{
    background-color: rgba(0, 0, 0, 0.34);
    min-width: 50%;

    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    width: fit-content;

    margin-left: auto;
    margin-right: auto;

    padding: 2em 2em;
    padding-bottom: 3em;
    border-radius: 16px;
}
.fantasy form.dark-container.solo{
    min-width: 500px;
    width: fit-content;
}
.fantasy form.dark-container.solo div.dark-container{
    min-width: 500px;
}

.fantasy div.dark-container > div:nth-child(1){
    width: 40%;
}
.fantasy div.dark-container > div:nth-child(2){
    width: 50%;
}
.fantasy .solo div.dark-container > div{
    width: 100%;
}

.fantasy form.profile-input h2{
    font-size: 2em;
}

.fantasy .profile-data-remove{
    width: min-content;
    padding: 0px 2em;

    position: relative;
}
.fantasy .profile-data-remove::after{
    content: "";
    border-right: 1px solid white;
    height:60%;
    position: absolute;
    top:20%;
    right:1em;
}
.fantasy .profile-data-remove .name{
    margin-top: 2em;
    text-transform: uppercase;
    font-size: 36px;
    background: -webkit-linear-gradient(0deg, #F09662, #DF643B);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: 0px;
    font-weight:900;
}
.fantasy .profile-data-remove .email{
    font-size: 24px;
    font-weight: 600;
}
.fantasy .profile-data-remove .tel{
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 2em;
}
.fantasy .profile-data-remove span{
    display: block;
    font-weight: 300;
}
.fantasy .profile-data-remove span a{
    font-weight: 300;
    color:#FF6A13;
    font-weight: 700;
    text-transform: uppercase;
    cursor: pointer;
}
a.profile-button{
    margin-left: 0px;
}

@media screen and (max-width:1400px) {
    a.profile-button{
        margin-left: auto;
    }
    .fantasy div.dark-container > div:nth-child(1){
        text-align: center;
    }
    .fantasy div.dark-container > div:nth-child(1),
    .fantasy div.dark-container > div:nth-child(2){
        width: 100%
    }
    .fantasy div.dark-container{
        flex-direction: column;
    }
    .fantasy .profile-data-remove .name{
        margin-top: 0.5em;
    }
    .fantasy .profile-data-remove{
        margin-bottom: 2em;
    }
    .fantasy .profile-data-remove::after{
        content: "";
        border-right: none;
        border-bottom: 1px solid white;
        height:0px;
        width: 70%;
        position: absolute;
        top:unset;
        right: unset;
        left:15%;
        bottom:-1em;
    }
}
.fantasy form.profile-input a{
    color:white;
    text-decoration: none;
}
.fantasy .score a{
    color:white;
    text-decoration: none;
}

.rules-flex-1{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
}
.rules span{
    font-size: 1.4em;
}
.rules orange{
    color: #FF6A13;
    font-size: 1.5em;
    font-weight: bold;
}
.rules-flex-1 > span{
    width: 40%;
}
.rules-flex-1 > img{
    width: 40%;
}

.rules-flex-2{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}
.rules-flex-2 img{
    width: 50%;
}
.rules-flex-2 .recs > div{
    background-color: rgba(0, 0, 0, 0.34);
    margin-bottom: 1em;
    border-radius: 1em;
    padding:1.5em;
    box-sizing: border-box;
}
.rules-flex-2 .recs > div:nth-of-type(){
    width:100%
}
.rules-flex-2 .recs > div:nth-of-type(2){
    width:90%
}
.rules-flex-2 .recs > div:nth-of-type(3){
    width:95%
}

.police-line{
    background-image: url("/public/img/fl-police-line.svg");
    background-size: 100% auto;
}
.police-line > div{
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;

    width: fit-content;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    background-color: rgba(0, 0, 0, 0.79);
    border-radius: 1em;
    padding:1.5em;
}
.police-line > div span:not(:last-child){
    margin-bottom: 1em;
}
img.inline{
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    display: block;
}
.glasses{
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.glasses > img{
    width: calc(100% - 10em);
    margin-bottom: 1em;
}
.glasses > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    text-align: center;
}

.nabor{
    margin-top: 5em;
    margin-bottom: 5em;
    max-width: 800px;
    background-image: url("/public/img/fl-rules-field.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-left: auto;
    margin-right: auto;
    padding: 4em 6em;
}
.nabor > span{
    display: block;
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.39);
    border-radius: 1em;
    padding:1.5em;
}
.rules h2{
    font-size: 2em;
}
.rules .table{
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    font-size: 1.5em;
}
.rules .table table{
    margin-left: auto;
    margin-right: auto;
    border-collapse:collapse;
    white-space: nowrap;
}
.rules .table > div{
    margin-left: auto;
    margin-right: auto;
    width: min-content;
    background-color: rgba(0, 0, 0, 0.39);
    border-radius: 1em;
    padding:1.5em;
}
.rules .table th{
    padding: 0px 1em;
}
.rules .table th:last-child{
    padding-right: 0px;
}
.rules .table td{
    padding: 0.25em 0px;
}
.rules .table tr td:first-child{
    padding-right: 3em;
}
.rules .table tr td:not(:first-child){
    text-align: center;
}

.rules .table tr.hr td{
    padding-bottom: 1em;
}
.rules .table tr.hr + tr td{
    padding-top: 1em;
}
.rules .table tr.hr{
    position: relative;
    border-bottom: 2px solid white;
}
/* .rules .table tr.hr::after{
    content: "";
    position: absolute;
    bottom: 1em;
    left:0px;
    width: 100%;
    border-bottom: 2px solid white;
} */

div.bottom{
    position: relative;
    height:40em;
}
img.bottom{
    width: 100%;
    height:100%;
    object-fit: cover;
    object-position: top center;
}
span.bottom{
    position: absolute;
    bottom:1em;
    left:50%;
    /* width: 100%; */
    max-width: 100vw;
    width: max-content;
    display: block;
    /* margin-top: -4em; */
    transform: translateX(-50%);
}

@media screen and (max-width:1400px) {
    .nabor{
        background-size: cover;
    }
    .rules-flex-1{
        flex-direction: column-reverse;
        align-items:flex-end;
    }
    .rules-flex-1 span{
        width: calc(100% - 2em);
        margin-bottom: -1em;
    }
    .rules-flex-2{
        overflow: hidden;
        padding-left: 1em;
    }
    .rules-flex-2 img{
        width: 50%;
        margin-left: -20%;
        transform: translateX(20%);
    }
    .police-line{
        padding:0px 1em;
    }
    .glasses{
        max-width: calc(100% - 4em);
    }
    div.bottom{
        height:30em;
    }
    span.bottom{
        padding: 0px 1em;
        box-sizing: border-box;
    }
}

.not-found-page{
    width:100%;
    margin-top:3em;
    max-height: 75vh;
    object-fit: contain;
    object-position: center;
}

.with-spinner{
    position: relative;
}

.spinner{
    display: none;
    position: absolute;
    top:0px;
    left:0px;
    width: 100%;
    height:100%;
    z-index: 99;
    background: url("/public/img/spinner.svg"), rgba(0, 0, 0, 0.64);

    background-size: 150px 105px;
    background-position: center;
    background-repeat: no-repeat;

    box-shadow: 0px 0px 50px 10px #000000;

    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                        supported by Chrome, Edge, Opera and Firefox */
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}
.spinner.active{
    display: block;
}

@media screen and (max-width:1600px) and (min-width:1400px){
    .fantasy .team .tours #tours-list .tour-item p{
        font-size: 18px;
    }
    .fantasy .team .tours #tours-list .tour-item span{
        font-size: 38px;
    }
}

.player-profile content{
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.player-profile .chart{
    background-color: rgba(0, 0, 0, 0.34);
    padding:1em 3em;
    box-sizing: border-box;
    padding-top: 1px;
    max-width: 75%;
    margin-left: auto;
    margin-right: auto;
}
.player-profile .chart h2{
    font-size: 1.5em;
    margin: 0.5em 0px;
}
.player-profile .chart canvas{
    width: 100%;
    box-sizing: border-box;
}
.player-profile .chart canvas.loading{
    background-image: url(/public/img/spinner.svg);
    background-size: auto 50%;
    background-position: center;
    background-repeat: no-repeat;
}

.player-profile .player-info{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin-bottom: 3em;
}
.player-profile .player-info .pic{
    width: fit-content;
}
.player-profile .player-info .pic img{
    /* width: 90%; */
    display: block;
    height: auto;
    height:15em;
}
.player-profile .player-info .info{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
}
.player-profile .player-info .info .stats{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
.player-profile .player-info .info .stats > div{
    width: 23%;
    margin-bottom: 1em;
    /* height: 4em; */
    border: 2px solid #FF5E00;
    border-radius: 12px;
    padding: 0.5em 0.25em;
    box-sizing: border-box;
    overflow: hidden;
}
.player-profile .player-info .info .stats > div span{
    display: block;
    text-align: center;
}
.player-profile .player-info .info .stats > div span:nth-child(1){
    font-size: 1em;
    font-weight: 500;
}
.player-profile .player-info .info .stats > div span:nth-child(2){
    font-size: 0.9em;
}

.player-profile .player-info .info .name h1{
    padding:0px;
}
.player-profile .player-info .info .name p{
    font-size: 1.25em;
}
.player-profile .player-info .info .name p img{
    height:2.5em;
    margin-bottom: -0.85em;
}
.player-profile .player-info .info .name p span:nth-child(2){
    padding-right: 0.5em;
    color: rgba(255, 255, 255, 0.73);
    border-right: 1px solid rgba(255, 255, 255, 0.73);
}
.player-profile .player-info .info .name p span:nth-child(3){
    margin-left: 0.35em;
    color: rgba(255, 255, 255, 0.73);
}

.player-profile .games-table table{
    min-width: 75%;
    margin-top: 1.5em;
    font-size: 1.5em;
    margin-left: auto;
    margin-right: auto;
    border-collapse: collapse;
}
.player-profile .games-table tr:nth-child(1){
    color: rgba(255, 255, 255, 0.73);
}
.player-profile .games-table tr:nth-child(1) th:nth-child(1){
    text-align: left;
}
.player-profile .games-table input{
    font-size: 0.75em;
}
.player-profile .games-table input:hover{
    border-radius:1.25em;
    cursor: pointer;
}
.player-profile .games-table tr img{
    display: block;
    height:1.75em;
    margin-left: auto;
    margin-right: auto;
}
.player-profile .games-table tr td:nth-child(1),
.player-profile .games-table tr th:nth-child(1){
    padding-left: 3em;
}
.player-profile .games-table tr td{
    font-weight: 600;
}
.player-profile .games-table tr td:not(:nth-child(1)){
    text-align: center;
}
.player-profile .games-table tr td:nth-child(3) span{
    border: 2px solid #FF5E00;
    width: 3.5em;
    padding:0.25em;
    box-sizing: border-box;
    border-radius: 14px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.player-profile .games-table tr td:nth-child(3) span a{
    text-decoration: none;
    color: #fff;
}
.player-profile .games-table tr td:nth-child(4) span{
    background-color: #FF5E00;
    width: 2em;
    padding:0.25em;
    box-sizing: border-box;
    border-radius: 14px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.player-profile .games-table tr.details:not(.active){
    display: none;
}
.player-profile .games-table tr.details p{
    padding: 0.25em 0px;
    margin: 0px;
    font-weight: 600;
    text-transform: uppercase;
    border-bottom: 4px solid rgba(255, 255, 255, 0.1);
}
.player-profile .games-table tr.details td:first-child p:first-child{
    color:transparent;
    border-bottom: none;
}
.player-profile .games-table tr.details td:last-child p:first-child{
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.75em;
    text-transform:none;
    line-height: 1.75em;
    border-bottom: none;
}
.player-profile .games-table tr.details td:last-child p{
    margin-left: -1px;
}
.player-profile .games-table tr.details p:not(:first-child){
    background-color: rgba(0, 0, 0, 0.432);
}

.player-profile .games-table tr.details p:last-child{
    margin-bottom: 0px;
    border-bottom: none;
}
@media screen and (max-width: 1400px) {
    .player-profile .games-table tr.details td:first-child{
        max-width:80vw;
    }
}
.player-profile .games-table tr.details td{
    padding-left: 0px;
}
.player-profile .games-table tr.details td:nth-child(1) p{
    padding-left: 3em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.player-profile .games-table tr:not(:nth-child(1)){
    background-color: rgba(0, 0, 0, 0.432);
    border-bottom: 4px solid rgba(255, 255, 255, 0.1);
}
.player-profile .games-table tr:last-child{
    border-bottom: none;
}
.player-profile .points-list table{
    min-width: 75%;
    font-size: 1.5em;
    margin-left: auto;
    margin-right: auto;
    border-collapse: collapse;
    padding-top: 2em;
    background-color: rgba(0, 0, 0, 0.432);

}
.player-profile .points-list table tr th span{
    margin-top: 1em;
    display: block;
}
.player-profile .points-list table tr th:nth-child(2){
    width: 40%;
}
.player-profile .points-list table tr:not(:nth-child(1)){
    background-color: rgba(0, 0, 0, 0.432);
    text-transform: uppercase;
    border-bottom: 4px solid rgba(255, 255, 255, 0.1);
    font-weight: 500;
}
.player-profile .points-list table tr:not(:nth-child(1)) td:nth-child(1){
    padding-left: 3em;
    margin-bottom: 1em;
}
.player-profile .points-list table tr:not(:nth-child(1)) td:nth-child(2) span{
    margin: 0.25em 0px;
    display: block;
    text-align: center;
}
.player-profile .controls{
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-top: 1em;
}
.player-profile .controls .arrow{
    background-image: url("/public/img/table_arrow.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% auto;
    cursor: pointer;
    height:2em;
    width:2em;
}
.player-profile .controls .arrow.inverted{
    transform: rotate(180deg);
}
.player-profile .controls .pages{
    font-size: 1.5em;
    margin:0px 1em;
}
.player-profile .controls .pages a{
    padding:0px 0.25em;
    cursor: pointer;
    text-decoration: none;
    color:white;
}
.player-profile .controls .pages a:hover{
    text-shadow: 0px 0px 5px #ffffff;
}

@media screen and (max-width:1400px) {
    .player-profile .games-table table,
    .player-profile .points-list table{
        width: 100%;
    }
    .player-profile .player-info .info{
        flex-direction: column;
        align-items: flex-start;
        padding-left: 5em;
    }
    .player-profile .chart {
        max-width: 100%;
    }
}

.player-profile .social{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
}
.player-info .social img{
    width: 5em;
    height: auto!important;
}
.player-profile .games-table input[type="button"]{
    background-color: transparent;
    padding-right: 3em;

    background-image: url("/public/img/select_arrow.svg");
    background-repeat: no-repeat;
    background-position: right 1em center;
    background-size: 1.5em auto;
    border: 2px solid #FF5E00;
    border-radius: 24px;
}
.player-profile .games-table input[type="button"].active{
    background-image: url("/public/img/select_arrow_reversed.svg");
}

.modal{
    display: none;
    position: fixed;
    width: 100vw;
    height:100vh;
    top:0px;
    left:0px;
    z-index: 99999;
}
.modal.active{
    display: block;
}
.modal.player-profile{
    overflow: auto;
    /* background-color: rgb(255, 0, 0); */
    padding-top: 8em;
    box-sizing: border-box;
    background:  url(/public/img/fl_noise_xs.png), rgba(73, 73, 73, 0.9);
    /* filter: brightness(0.5); */
    background-repeat: repeat;
    background-size: 250px auto;
}
body.modaled{
    overflow: hidden;
}
.modal > .cross{
    position: fixed;
    top:0;
    right:0;
    padding: 0.5em;
    border: 2px solid #FF5E00;
    border-top: none;
    text-transform: uppercase;
    height: fit-content;
    width: fit-content;
    font-size: 1.5em;
    border-radius: 0 0 0 1em;
    /* background-image: url("/public/img/fantasy_cross.svg");
    background-size: 3em 3em;
    background-repeat: no-repeat;
    background-position: center; */
    cursor: pointer;
}

@media screen and (max-width:1600px) {
    .fantasy .team .table#rating-table table td:nth-child(2){
        max-width: 400px;
    }
}
@media screen and (max-width:1800px) {
    .fantasy .team .table#rating-table table td:nth-child(2){
        max-width: 280px;
    }
}

.table-btns{
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
    padding: 2em 0px;
}
.table-btns > a{
    position: relative;
    border-radius: 2em;
    font-size: 1.5em;
    font-weight: bold;
    text-transform: uppercase;
    border: 4px solid white;
    padding: 0.5em 1em;
    cursor: pointer;
    transition: all 0.25s ease-in-out;
    background: linear-gradient(90deg ,transparent, transparent);
    overflow: hidden;
}
.table-btns > a:first-child{
    padding: 0.5em 3em;
}
.table-btns > a.active{
    border-color: transparent;
}
.table-btns > a::before{
    content: "";
    position: absolute;
    top:0px;
    left:0px;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: linear-gradient(90deg ,#EC9363, #D0664E);
    opacity: 0;

    transition: all 0.25s ease-in-out;
}
.table-btns > a.active::before{
    opacity: 1;
}
.table-btns > a:hover:not(.active)::before{
    opacity: 0.75;
}
.fantasy h1.def-width{
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
}
.qualific{
    max-width: 1300px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    flex-direction: column;
    display: none;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
    margin-top: 0.5em;
}
.qualific.active{
    display: flex;
}
/* .qualific.qual-q tr{
    padding-bottom: 0.5em;
} */
.qualific.qual-q{
    text-align: center;
}
.qualific.qual-q > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    background-color: #FF5E00D9;
    width: 100%;
    border-radius: 0.5em;
}
.qualific.qual-q > div > div{
    flex-basis: 10%;
    width: 100%;
}

.qualific.qual-q > div > div:nth-child(1){
    font-size: 1.5em;
    flex-basis: 10%;
    font-weight: bold;
}
.qualific.qual-q > div > div:nth-child(2){
    flex-basis: 47.5%;

}
.qualific.qual-q > div > div:nth-child(3){
    flex-basis: 25%;
}
.qualific.qual-q > div > div:nth-child(2) > a{
    font-size: 1.5em;
    font-weight: bold;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    gap: 0.75em;
}
.qualific.qual-q > div > div:nth-child(2) > a > p{
    flex-basis: calc(100% - 5em);
}
.qualific.qual-q > div > div:nth-child(2) img{
    height: 2em;
}
.qualific.qual-q > div > div:nth-child(3) > a{
    flex-basis: 30%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75em;
    text-decoration: none;
    color: inherit
}
.qualific.qual-q > div > div:nth-child(3) img{
    height: 2em;
    margin-left: 25%;
}

@media screen and (max-width: 1140px) {
    .qualific.qual-q > div > div:nth-child(3) img{
        margin-left: 0px;
    }
}


.qualific.qual-oct{
    text-align: center;
}
.qualific.qual-oct > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    background-color: #FF5E00D9;
    width: 100%;
    border-radius: 0.5em;
    min-height: 3em;
}
.qualific.qual-oct > div > div{
    flex-basis: 25%;
    width: 100%;
}
.qualific.qual-oct > div > div:nth-child(1),
.qualific.qual-oct > div > div:nth-child(5){
    font-size: 1.5em;
    flex-basis: 15%;
    font-weight: bold;
    text-align: center;
}
.qualific.qual-oct > div > div:nth-child(2),
.qualific.qual-oct > div > div:nth-child(4){
    font-size: 1.5em;
    flex-basis: 25%;
    font-weight: bold;
    text-align: center;
}
.qualific.qual-oct > div > div:nth-child(3){
    flex-basis: 20%;
}
.qualific.qual-oct > div > div:nth-child(3) > div{
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    gap: 0.25em;
    background-color: white;
    width: fit-content;
    padding: 0.25em 1em;
    color: black;
    border-radius: 0.5em;
    margin: 0.5em 0px;
    margin-left: auto;
    margin-right: auto;
}
.qualific.qual-oct > div > div:nth-child(3) > div > span:nth-child(1),
.qualific.qual-oct > div > div:nth-child(3) > div > span:nth-child(3),
.qualific.qual-oct > div > div:nth-child(3) > div > span:nth-child(2){
    font-size: 1.5em;
    font-weight: bold;
}
.qualific.qual-oct > div > div:nth-child(3) > div > span:nth-child(2){
    margin: 0px 0.25em;
}

.qualific.qual-quart{
    text-align: center;
}
.qualific.qual-quart > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    background-color: #FF5E00D9;
    width: 100%;
    border-radius: 0.5em;
    min-height: 3em;
}
.qualific.qual-quart > div > div{
    flex-basis: 25%;
    width: 100%;
}
.qualific.qual-quart > div > div:nth-child(1),
.qualific.qual-quart > div > div:nth-child(5){
    font-size: 1.5em;
    flex-basis: 15%;
    font-weight: bold;
    text-align: center;
}
.qualific.qual-quart > div > div:nth-child(2),
.qualific.qual-quart > div > div:nth-child(4){
    font-size: 1.5em;
    flex-basis: 25%;
    font-weight: bold;
    text-align: center;
}
.qualific.qual-quart > div > div:nth-child(3){
    flex-basis: 20%;
}
.qualific.qual-quart > div > div:nth-child(3) > div{
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    gap: 0.25em;
    background-color: white;
    width: fit-content;
    padding: 0.25em 1em;
    color: black;
    border-radius: 0.5em;
    margin: 0.5em 0px;
    margin-left: auto;
    margin-right: auto;
}
.qualific.qual-quart > div > div:nth-child(3) > div > span:nth-child(1),
.qualific.qual-quart > div > div:nth-child(3) > div > span:nth-child(3),
.qualific.qual-quart > div > div:nth-child(3) > div > span:nth-child(2){
    font-size: 1.5em;
    font-weight: bold;
}
/*.qualific.qual-quart > div > div:nth-child(3) > div > span:nth-child(2){
    margin: 0px 0.25em;
}
.qualific.qual-quart > div > div:nth-child(3) > div > span:nth-child(2),
.qualific.qual-quart > div > div:nth-child(3) > div > span:nth-child(5){
    font-weight: 600;
}*/

.qualific.qual-half{
    text-align: center;
}
.qualific.qual-half > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    background-color: #FF5E00D9;
    border-radius: 0.5em;
    width: 100%;
    min-height: 3em;
}
.qualific.qual-half > div > div{
    flex-basis: 25%;
    width: 100%;
}
.qualific.qual-half > div > div:nth-child(1),
.qualific.qual-half > div > div:nth-child(5){
    font-size: 1.5em;
    flex-basis: 15%;
    font-weight: bold;
    text-align: center;
}
.qualific.qual-half > div > div:nth-child(2),
.qualific.qual-half > div > div:nth-child(4){
    font-size: 1.5em;
    flex-basis: 25%;
    font-weight: bold;
    text-align: center;
}
.qualific.qual-half > div > div:nth-child(3){
    flex-basis: 20%;
}
.qualific.qual-half > div > div:nth-child(3) > div{
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    gap: 0.25em;
    background-color: white;
    width: fit-content;
    padding: 0.25em 1em;
    color: black;
    border-radius: 0.5em;
    margin: 0.5em 0px;
    margin-left: auto;
    margin-right: auto;
}
.qualific.qual-half > div > div:nth-child(3) > div > span:nth-child(1),
.qualific.qual-half > div > div:nth-child(3) > div > span:nth-child(3),
.qualific.qual-half > div > div:nth-child(3) > div > span:nth-child(2){
    font-size: 1.5em;
    font-weight: bold;
}
.qualific.qual-half > div > div:nth-child(3) > div > span:nth-child(2){
    margin: 0px 0.25em;
}
/*.qualific.qual-half > div > div:nth-child(3) > div > span:nth-child(2),
.qualific.qual-half > div > div:nth-child(3) > div > span:nth-child(5){
    font-weight: 600;
}*/


.qualific.qual-final{
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    text-align: center;
    background-color: #FF5E00D9;
    border-radius: 0.5em;
    padding: 3em 0px;
    font-size: 1.5em;
}
.qualific.qual-final > div{
    flex-basis: 33.33%;
    width: 33.33%;
}

.qualific.qual-final > div:nth-child(1),
.qualific.qual-final > div:nth-child(3){
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: end;
    gap: 0.5em;
    font-weight: bold;
}
.qualific.qual-final > div:nth-child(1) > img,
.qualific.qual-final > div:nth-child(3) > img{
    width: 50%;
}
.qualific.qual-final > div:nth-child(2) > img{
    width: 50%;
}
.qualific.qual-final > div:nth-child(2) > div{

    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.25em;
    background-color: white;
    width: fit-content;
    padding: 0.25em 1em;
    color: black;
    border-radius: 0.5em;
    margin-top: -4px;
    position: relative;
    z-index: 2;
    margin-left: auto;
    margin-right: auto;
}

.qualific.qual-final > div:nth-child(2) > div > span:nth-child(1),
.qualific.qual-final > div:nth-child(2) > div > span:nth-child(4),
.qualific.qual-final > div:nth-child(2) > div > span:nth-child(3){
    font-size: 1.25em;
    font-weight: bold;
}
.qualific.qual-final > div:nth-child(2) > div > span:nth-child(2){
    margin: 0px 0.25em;
}
.qualific.qual-final > div:nth-child(2) > div > span:nth-child(2),
.qualific.qual-final > div:nth-child(2) > div > span:nth-child(5){
    font-weight: 600;
}

.tabs .tabs-buttons{
    display: flex;
    flex-direction: row;
    align-items: center;
    text-transform: uppercase;
    overflow: hidden;
    padding-bottom: 1em;
    margin-bottom: 2em;
}
.tabs-buttons > * {
    display: block;
    height: 100%;
    color: var(--color-pale-white);
    padding: 0.5em 2em;
    cursor: pointer;
    padding-bottom: 0px;
    border: 1px solid transparent;
    border-radius: 15px 15px 0 0;
    border-width: 2px;
    text-decoration: none;
}
.tabs-buttons > *.active {
    color: white;
    position: relative;
    border-top: 1px solid var(--color-orange);
    border-left: 1px solid var(--color-orange);
    border-right: 1px solid var(--color-orange);
    border-width: 2px;
    border-radius: 15px 15px 0 0;
}
.tabs-buttons > *.active::before, .tabs-buttons > *.active::after {
    /* opacity: 1; */
    content: "";
    border-color: var(--color-orange);
}
.tabs-buttons > *::before {
    right: 100%;
}
.tabs-buttons > *::before, .tabs-buttons > *::after {
    position: absolute;
    display: block;
    width: 100vw;
    height: 1em;
    bottom: calc(-1em + 1px);
    border-bottom: 1px solid var(--color-orange);
    border-left: 1px solid var(--color-orange);
    border-right: 1px solid var(--color-orange);
    border-radius: 0 0 15px 15px;
    border-color: transparent;
    border-width: 2px;
    z-index: -1;
}
.tabs-buttons > *::after {
    left: 100%;
}
.tabs-container .tab:not(.active) {
    display: none;
}

.tabs-container .tab.active.h2h-tournaments--active{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}

content.content-padding{
    padding: 1em 3em;
    display: block;
}


.tabs-container .tab.active.h2h-tournaments--active{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
}
.h2h-tournaments--active > div{
    border-radius: 27px;
    border: 5px solid var(--fantasy-orange);
    background: white;
    width: 100%;
    padding: 20px;
    min-height: 200px;
    color: var(--fantasy-orange);
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    box-sizing: border-box;
    gap: 20px;
}
.h2h-tournaments--active > div > span{
    font-size: 48px;
    font-weight: 900;
    max-width: calc(((1260px) / 2) - 40px - 20px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-transform: uppercase;
}
.h2h-tournaments--active > div > div{
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 20px;
    align-items: center;
}
.h2h-tournaments--active > div > div img{
    width: 150px;
    height: 150px;
    object-fit: contain;
    object-position: center;
}
.h2h-tournaments--active > div > div > div{
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 100px;
}
.h2h-tournaments--active > div > div > div > span:nth-child(1){
    font-size: 40px;
    font-weight: 400;
}
.h2h-tournaments--active > div > div > div > span:nth-child(2){
    font-size: 28px;
    font-weight: 400;
    line-height:1em;
}
.h2h-tournaments--active > div > div > div > span:nth-child(3){
    font-size: 28px;
    line-height: 28px;
    font-weight: 200;
    border-radius: 10px;
    border: 2px solid var(--fantasy-orange);
    width: fit-content;
    padding: 10px;
}

.h2h-tournaments--group{
    display: grid;
    grid-template-columns: 1.4fr 2fr;
    gap: 20px;
}
.h2h-tournaments--group > div:first-child{
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.h2h-tournaments--group > div:first-child > div:first-child{
    border-radius: 27px;
    border: 5px solid var(--fantasy-orange);
    background: white;
    width: 100%;
    padding: 20px;
    min-height: 250px;
    height: max-content;
    color: var(--fantasy-orange);
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    box-sizing: border-box;
    gap: 20px;
}
.h2h-tournaments--group > div:first-child > div:first-child > div{
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 20px;
    align-items: center;
}
.h2h-tournaments--group > div:first-child > div:first-child > div img{
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
}
.h2h-tournaments--group > div:first-child > div:first-child > div > div{
    display: flex;
    flex-direction: column;
    gap: 10px;
    color:#083C77;
}
.h2h-tournaments--group > div:first-child > div:first-child > div > div span{
    line-height: 1em;
    text-transform: uppercase;
}
.h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(1){
    font-size: 40px;
    font-weight: 900;
    display: block;
    max-width: 420px;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 10px;
}
@media screen and (max-width:1646px) {
    .h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(1){
        max-width: calc(33vw - 80px - 170px);
        font-size: 30px;
    }
    .h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(4){
        font-size: 20px!important;
    }
}
@media screen and (max-width:1400px) {
    .h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(1){
        max-width: calc(100vw - 170px - 80px - 100px);
    }
}
.h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(2){
    color: var(--fantasy-orange);
    font-size: 25px;
}
.h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(3){
    font-size: 20px;
    margin-top: 0.5em;
}
.h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(3) a{
    border-radius: 0.5em;
    border: 2px solid var(--fantasy-orange);
    padding: 0.5em;
    color: var(--fantasy-orange);
    font-weight: 600;
    text-decoration:none;
}
.h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(4){
    color: white;
    border-radius: 30px;
    font-size: 30px;
    width: fit-content;
    background: var(--fantasy-orange);
    padding: 10px 20px;
    font-weight: bold;
    margin-top: 10px;
}
.h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(4) a{
    color: inherit;
    text-decoration: none;
}
.h2h-tournaments--group--tour > div:nth-child(1),
.h2h-tournaments--group--table > div:nth-child(1){
    background: var(--fantasy-orange);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    min-height: 71px;
    gap: 30px;
}

.h2h-tournaments--group--tour > div:nth-child(1) select,
.h2h-tournaments--group--table > div:nth-child(1) span{
    background-color: var(--fantasy-orange);
    box-shadow: none;
    font-size: 38px;
    padding: 0px;
    border-radius: 0px!important;
    text-transform: none;
    font-weight: bold;
}
.h2h-tournaments--group--tour > div:nth-child(1) select{
    background-image: url("/public/img/select_arrow.svg");
    padding-right: 2em;
    background-repeat: no-repeat;
    background-position: right 0.25em center;
    background-size: 1.25em auto;
}

.h2h-tournaments--group--tour > div:nth-child(1) a > img{
    height: 1.25em;
    width: auto;
    cursor: pointer;
}
.h2h-tournaments--group--tour > div:nth-child(1) a:nth-child(1){
    transform: rotate(90deg);
}
.h2h-tournaments--group--tour > div:nth-child(1) a:nth-child(3){
    transform: rotate(-90deg);
}

.h2h-tournaments--group--tour > div:nth-child(2),
.h2h-tournaments--group--table > div:nth-child(2){
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 4px;
    padding-bottom: 100px;
    /* max-height: 300px; */
}
.h2h-tournaments--group--tour > div:nth-child(2){
    max-height: 1154px;
    overflow: auto;
}
.h2h-tournaments--group--table > div:nth-child(2){
    max-height: 1426px;
    overflow: auto;
}
.h2h-tournaments--group--tour > div:nth-child(2) > div{
    display: grid;
    grid-template-columns: 2fr 1fr 2fr;
    column-gap: 4px;
    padding: 10px 10px;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0.384);
    cursor: pointer;
    transition: background 0.15s ease-in-out;
}
@media screen and (max-width: 1400px) {
    .h2h-tournaments--group--tour > div:nth-child(2) > div{
        grid-template-columns: 2fr 1.5fr 2fr;
    }
    .h2h-tournaments--group--tour > div:nth-child(2),
    .h2h-tournaments--group--table > div:nth-child(2){
        padding-bottom: 20px;
    }
}
/* .h2h-tournaments--group--tour > div:nth-child(2) > div:hover{
    background: #273f6b;
} */
.h2h-tournaments--group--tour > div:nth-child(2) > div span{
    font-size: 26px;
    text-transform: uppercase;
    font-weight: bold;
    overflow: hidden;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;
    flex-direction: row;
    align-items: center;
}
.h2h-tournaments--group--tour > div:nth-child(2) > div span:not(:nth-child(2)){
    font-size: 20px;
}
@media screen and (max-width: 2200px) and (min-width: 1400px){
    .h2h-tournaments--group--tour > div:nth-child(2) > div{
        grid-template-columns: 2fr 1.5fr 2fr;
    }
    .h2h-tournaments--group--tour > div:nth-child(2) > div span{
        font-size: 22px;
    }
    .h2h-tournaments--group--tour > div:nth-child(2) > div span:not(:nth-child(2)){
        font-size: 15px;
    }
}
.h2h-tournaments--group--tour > div:nth-child(2) > div span:nth-child(1){
    text-align: end;
    justify-content: end;
}
.h2h-tournaments--group--tour > div:nth-child(2) > div span:nth-child(2){
    text-align: center;
    justify-content: center;
    opacity: 0.75;
}
.h2h-tournaments--group--tour > div:nth-child(2) > div span:nth-child(3){
    text-align: start;
    justify-content: start;
}
.h2h-tournaments--group--tour > div:nth-child(2) > div span.largetext{
    font-size: 14px;
}

.h2h-tournaments--group--table > div:nth-child(2) > div{
    display: grid;
    grid-template-columns: 1fr 6fr 1fr 1fr 1fr 1fr 1fr 1fr;
    column-gap: 4px;
    /* padding: 10px 0px; */
    row-gap: 4px;
    box-sizing: border-box;
    /* min-width: 1000px; */
}
@media screen and (max-width: 1000px) {
    .h2h-tournaments--group--table > div:nth-child(2){
        width: calc(100vw - 100px);
    }
    .h2h-tournaments--group--table > div:nth-child(2) > div{
        grid-template-columns: 1fr 5fr 1fr 1fr 1fr 1fr 1fr 2fr;
    }
}
.h2h-tournaments--group--table > div:nth-child(2) > div > span{
    font-size: 26px;
    font-weight: bold;
    display: flex;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-direction: row;
    align-items: center;
    padding: 5px 0px;
    background: rgba(0, 0, 0, 0.384);
    overflow: visible;
}
.h2h-tournaments--group--table > div:nth-child(2) > div:first-child > span{
    background: #c9201496;
}
.h2h-tournaments--group--table > div:nth-child(2) > div > span:last-child{
    font-size: 20px;
}
.h2h-tournaments--group--table > div:nth-child(2) > div:first-child > span:last-child{
    font-size: 12px;
}
.h2h-tournaments--group--table > div:nth-child(2) > div > span:not(:nth-child(2)){
    text-align: center;
    justify-content: center;
}
.h2h-tournaments--group--table > div:nth-child(2) > div > span:nth-child(2){
    padding-right: 10px;
    padding-left: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    box-sizing: border-box;
}
.h2h-tournaments--group--table > div:nth-child(2) > div > span a{
    text-decoration: none;
    color:inherit;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    box-sizing: border-box;
}
.h2h-tournaments--group--table > div:nth-child(2) > div:not(:first-child) > span:nth-child(7){
    background: #ADADAD;
}
/* .h2h-tournaments--group--table > div:nth-child(2){
    max-height: 625px;
} */
.h2h-tournaments--group--table > div:nth-child(2) > div:nth-child(2) > span:nth-child(1),
.h2h-tournaments--group--table > div:nth-child(2) > div:nth-child(3) > span:nth-child(1),
.h2h-tournaments--group--table > div:nth-child(2) > div:nth-child(4) > span:nth-child(1){
    background: rgba(107, 255, 132, 0.38);
}
/* .h2h-tournaments--group--table > div:nth-child(2) > div:nth-child(7) > span:nth-child(1){
    background: rgba(83, 134, 92, 0.34);
} */


@media screen and (max-width: 630px){
    .h2h-tournaments--active > div > span{
        max-width: calc(((1260px)) - 80px - 40px);
    }
}

@media screen and (max-width: 1400px){
    .h2h-tournaments--group{
        grid-template-columns: 1fr;
    }
    .tabs-container .tab.active.h2h-tournaments--active{
        grid-template-columns: 1fr;
    }
    .h2h-tournaments--active > div{
        padding: 20px 40px;
    }

    .h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(1){
        font-size: 50px;
    }
    .h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(2),
    .h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(3){
        font-size: 30px;
    }
    .h2h-tournaments--group > div:first-child > div:first-child > div > div span:nth-child(4){
        font-size: 20px;
    }
    .h2h-tournaments--active > div > span{
        max-width: calc(((100vw)) - 80px - 40px);
    }
}
@media screen and (max-width: 700px){
    .h2h-tournaments--group > div:first-child > div:first-child > div{
        grid-template-columns: 150px 1fr;
    }
    .h2h-tournaments--group > div:first-child > div:first-child > div img{
        width: 100%;
        height: auto;
    }
}


.h2h--stat{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 1456px;
    max-width: calc(100% - 2em);
    height: auto;
    max-height: calc(100% - 2em);
    border-radius: 15px;
    border: 5px solid white;
    background: #333333;
    overflow: auto;
}
.h2h--stat > img{
    position: absolute;
    top: 15px;
    right: 15px;
    width: 70px;
    height: 70px;
    cursor: pointer;
    background: white;
    border-radius: 100%;
}
.h2h--stat--content{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 8px;
    row-gap: 20px;
    padding: 20px;
    box-sizing: border-box;
}
.h2h--stat--content > div{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 8px;
}

.h2h--stat--content .h2h--stat--content--score{
    display: flex;
    flex-direction: row;
    align-items: end;
}
.h2h--stat--content .h2h--stat--content--score:nth-child(1){
    justify-content: end;
    text-align: end;
}
.h2h--stat--content .h2h--stat--content--score:nth-child(2){
    justify-content: start;
    text-align: start;
}
.h2h--stat--content .h2h--stat--content--score > div{
    display: flex;
    flex-direction: column;
}
.h2h--stat--content .h2h--stat--content--score > div > div{
    display: flex;
    flex-direction: row;
    gap: 4px;
}
.h2h--stat--content .h2h--stat--content--score:nth-child(1) > div > div{
    justify-content: end;
}
.h2h--stat--content .h2h--stat--content--score > div > div > span{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 5px;
    background: #39DC66;
    font-size: 16px;
}
.h2h--stat--content .h2h--stat--content--score > div > div > span.red{
    background: #F15A5A;
}
.h2h--stat--content .h2h--stat--content--score > div > div > span.green{
    background: #39DC66;
}
.h2h--stat--content .h2h--stat--content--score > div > div > span.yellow{
    background: #D3C435;
}
.h2h--stat--content .h2h--stat--content--score > div > p{
    margin: 0px;
    font-size: 40px;
    font-weight: bold;
    text-transform: uppercase;
}

.h2h--stat--content .h2h--stat--content--score > span{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 60px;
    padding: 0px 10px;
    box-sizing: border-box;
    height: 60px;
    margin: 0px 10px;
    border-radius: 5px;
    background: #F15A5A;
    font-size: 40px;
}
.h2h--stat--content .h2h--stat--content--score:nth-child(2) > span{
    background: #39DC66;
}


.h2h--stat--content .h2h--stat--content--rezerv{
    display: flex;
    flex-direction: column;
    /* justify-content: end; */
    gap: 4px;
}

.h2h--stat--content .h2h--stat--content--rezerv > p{
    font-size: 36px;
    margin: 0px;
    text-align: center;
    font-weight: 400;
    min-height: 65px;
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2){
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div{
    display: flex;
    flex-direction: row;
    justify-content: end;
    padding: 4px 0px;
    gap: 10px;
    align-items: center;
    min-height: 57px;
}
.h2h--stat--content .h2h--stat--content--rezerv:last-child > div:nth-child(2) > div{
    flex-direction: row-reverse;
    justify-content: start;
}
.h2h--stat--content .h2h--stat--content--rezerv:first-child > div:nth-child(2) > div:not(.det){
    padding-right: 40px;
    background-color: rgba(0, 0, 0, 0.32);
}
.h2h--stat--content .h2h--stat--content--rezerv:last-child > div:nth-child(2) > div:not(.det){
    padding-left: 40px;
    background-color: rgba(0, 0, 0, 0.32);
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div.det{
    padding-right: 8px;
    padding-left: 8px;
    background-color: #533A3A;
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div > img{
    height: 45px;
    width: auto;
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div > span:first-child{
    font-size: 16px;
    text-transform: uppercase;
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div > span:last-child{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 5px;
    background: #39DC66;
    font-size: 16px;
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(3){
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(3) > div{
    border-radius: 20px;
    padding: 20px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-sizing: border-box;
    border: 3px solid white;
    background: #533A3A;
    min-height: 173px;
}
.h2h--stat--content .red .h2h--stat--content--rezerv > div:nth-child(3) > div{
    background: #533A3A;
}
.h2h--stat--content .green .h2h--stat--content--rezerv > div:nth-child(3) > div{
    background: #39DC66;
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(3) > div > span:nth-child(1){
    font-size: 24px;
    text-align: center;
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(3) > div > span:nth-child(2){
    font-size: 24px;
    text-align: center;
    font-weight: bold;
}
.h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(3) > div > span:nth-child(3){
    font-size: 63px;
    text-align: center;
    font-weight: bold;
}

.h2h--stat--content--list{
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.h2h--stat--content--list > div{
    display: flex;
    flex-direction: row;
    justify-content: end;
    padding: 4px 8px;
    gap: 10px;
    min-height: 57px;
    align-items: center;
    background: rgba(0, 0, 0, 0.32);
}
.h2h--stat--content--list > div.green-line{
    background: rgba(57, 220, 103, 0.34);
}
.h2h--stat--content--list:first-child > div{
    flex-direction: row-reverse;
    justify-content: start;
    padding-left: 20px;
}
.h2h--stat--content--list:last-child > div{
    padding-right: 20px;
}
.h2h--stat--content--list > div > span:first-child{
    font-size: 16px;
    text-transform: uppercase;
    display: block;
    width: calc((1456px - 40px - 8px - 8px - 8px) / 4 - 140px - 10px - 30px);
    overflow: hidden;
    text-overflow: ellipsis;
}
.red .h2h--stat--content--list > div > span:first-child{
    text-align: end;
}
.h2h--stat--content--list > div.captain::before{
    content: "К";
    box-sizing: content-box;
    font-weight: bold;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
    background-color: rgb(255, 1, 62);
    font-size: 0.82em;
    line-height: 1em;
    padding: 0.2em;
    border-width: 1px;
    border-style: solid;
    border-color: white;
    border-image: initial;
    border-radius: 100%;
}
.h2h--stat--content--list > div.red-name > span:first-child{
    color: #FF89A5;
}
.h2h--stat--content--list > div > img{
    height: 55px;
    width: 55px;
    object-fit: contain;
    object-position: center;
}
.h2h--stat--content--list > div > span:last-child{
    font-size: 24px;
    text-transform: uppercase;
    background: #39DC66;
    border-radius: 5px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
}
.h2h--stat--content--list > div.red-score > span:last-child{
    background: #F15A5A;
}

@media screen and (max-width: 1600px){
    /* 36 */
    .h2h--stat--content .h2h--stat--content--rezerv > p{
        font-size: 26px;
    }
    /* 16 */
    .h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div > span:first-child,
    .h2h--stat--content--list > div > span:first-child{
        font-size: 12px;
    }
    /* 40 */
    .h2h--stat--content .h2h--stat--content--score > div > p,
    .h2h--stat--content .h2h--stat--content--score > span{
        font-size: 30px;
    }
    /* 24 */
    .h2h--stat--content--list > div > span:last-child,
    .h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(3) > div > span:nth-child(1),
    .h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(3) > div > span:nth-child(2){
        font-size: 16px;
    }
    /* 63 */
    .h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(3) > div > span:nth-child(3){
        font-size: 45px;
    }
    .h2h--stat{
        width: 1300px;
    }
    .h2h--stat--content--list > div > span:first-child{
        width: calc((1300px - 40px - 8px - 8px - 8px) / 4 - 140px - 10px - 30px);
    }
    .h2h--stat--content--list > div > span:last-child,
    .h2h--stat--content--list > div > img,
    .h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div > img{
        width: 35px;
        height: 35px;
    }
    .h2h--stat--content--list > div,
    .h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div{
        min-height: 40px;
    }
    .h2h--stat--content .h2h--stat--content--rezerv > p{
        min-height: 48px;
    }
    .h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(3) > div{
        min-height: 123px;
    }
    .h2h--stat--content .h2h--stat--content--score > span{
        min-width: 45px;
        height: 45px;
    }
    .h2h--stat > img{
        width: 50px;
        height: 50px;
    }

    /* .h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div{
        min-height: 58px;
    } */
}
@media screen and (max-width: 1200px) {
    .h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div > span:last-child{
        font-size: 24px;
        text-transform: uppercase;
        background: #39DC66;
        border-radius: 5px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
    }
    .h2h--stat--content .h2h--stat--content--rezerv:last-child > div:nth-child(2) > div:not(.det){
        padding-left: 66px;
    }
    .h2h--stat--content .h2h--stat--content--rezerv:first-child > div:nth-child(2) > div:not(.det){
        padding-right: 58px;
    }
    .h2h--stat--content{
        padding-top: 100px;
    }
    .h2h--stat--content > div{
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    .h2h--stat--content > div:nth-child(3){
        flex-direction: column-reverse;
    }
    .h2h--stat--content--list > div > span:first-child{
        font-size: 16px;
        width: calc((50vw - 20px - 8px) - 140px - 20px);
    }
    .h2h--stat--content .h2h--stat--content--score > div > p{
        font-size: 30px;
        width: calc(50vw - 60px - 40px - 50px);
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .h2h--stat--content .h2h--stat--content--rezerv > div:nth-child(2) > div > span:first-child{
        font-size: 16px;
    }
}

.ppr--header{
    display: flex;
    flex-direction: row;
    align-items: end;
    justify-content: space-between;
    margin-bottom: 40px;
}
.ppr--header > div{
    display: flex;
    flex-direction: row;
    gap: 40px;
}
.ppr--header h1{
    padding: 0px;
}
.ppr--header > div a{
    color: white;
    opacity: 1;
    text-decoration: underline;
    text-decoration-color: rgba(255, 255, 255, 0.72);
    cursor: pointer;
    font-size: 26px;
}
@media screen and (max-width: 1400px){
    .ppr--header{
        flex-direction: column;
        gap: 20px;
        align-items: start;
    }
    .ppr--header > div{
        width: 100%;
        gap: 10px;
        justify-content: space-between;
    }
}

.predictor-profile--rooms{
    padding: 0px 1em;
    max-width: 1646px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    margin-top: 40px;
    margin-bottom: 40px;
}
.predictor-profile--rooms a.button::before{
    background: var(--fantasy-blue);
}
.predictor-profile--rooms a.button{
    margin-bottom: 40px;
    width: fit-content;
}
.predictor-profile--rooms > p{
    font-size: 26px;
    max-width: 1000px;
}
.ppr--create{
    display: flex;
    flex-direction: row;
    gap: 10px;
    margin-bottom: 40px;
}
.ppr--create input[type="text"]{
    border: none;
    /* background: #5A6E90; */
    font-weight: 100;
    outline: none;
    font-size: 26px;
    height: 60px;
    box-sizing: border-box;
    border-radius: 15px;
    padding-left: 0.5em;
    padding-right: 0.5em;
    width: unset;
}
.ppr--create input[type="text"]::placeholder{
    color: white;
    font-family: 'Montserrat', sans-serif;
    font-weight: 100;
    font-size: 26px;
}
.ppr--create select{
    font-size: 26px;
    height: 61px;
    border-radius: 15px!important;
    padding: 0.5em 0.2em;
    padding-left: 0.5em;
    padding-right:3em;
    box-shadow: none;
}

@media screen and (max-width: 1400px) {
    .ppr-list{
        margin-top: 80px;
        position: relative;
    }
    .ppr-list::before{
        content: "";
        position: absolute;
        top: -40px;
        left: 0%;
        width: 100%;
        border-top: 2px solid white;
    }
}

.ppr-list--header,
.ppr-list--content > div{
    display: grid;
    grid-template-columns: 5fr 3fr 2fr 1fr 4fr 4fr;
    margin-bottom: 4px;
    height: 71px;
    align-items: center;
    padding: 0px 10px 0px 20px;
}
.ppr-list--header{
    background: #FF5E00;
}
.ppr-list--content > div{
    background-color: rgba(0, 0, 0, 0.384);
}
.ppr-list--header > span:not(:first-child),
.ppr-list--content > div > span:not(:first-child){
    text-align: center;
}
.ppr-list--header > span,
.ppr-list--content > div > *{
    color: white;
    font-size: 28px;
}
.ppr-list--content > div > *{
    font-weight: bold;
}
.ppr-list--content > div > a{
    text-align: center;
    padding: 10px 30px;
    border-radius: 100px;
    width: fit-content;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    cursor: pointer;
    font-size: 1em;
}
.ppr-list--content > div > a:nth-child(6){
    border: 3px solid var(--color-orange);
    text-decoration: none;
}
.ppr-list--content > div > a:nth-child(5){
    background: linear-gradient(90deg, #F39C65 0%, #DA7858 100%);
    text-decoration: none;
}
.ppr-list--content > div > span:nth-child(4) > a > img{
    width: 2em;
    cursor: pointer;
    height: 2em;
}


@media screen and (max-width: 1400px){
    /* .predictor-profile--rooms a.button{
        margin-left: auto;
        margin-right: auto;
    } */
    .ppr--create{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
    }
    .ppr--create > input{
        min-width: 0px;
    }
    .ppr-list--header, .ppr-list--content > div{
        height: 80px;
    }
    .ppr-list--header > span, .ppr-list--content > div > *{
        font-size: 14px;
    }
    .ppr-list--content > div > a{
        padding: 10px 10px;
        font-size: 0.75em;
    }

    .predictor a.button,
    .predictor input[type="submit"],
    .predictor input[type="button"],
    .ppr--create select{
        border-radius: 15px;
        font-size: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 60px;
        cursor: pointer;
        box-sizing: border-box;
        font-weight: bold;
    }
}

.ppr--create input[type="submit"]{
    background: linear-gradient(90deg, #F39C65 0%, #DA7858 100%);
    color: white;
    text-transform: uppercase;
    border-radius: 54px;
    border: none;
    height: fit-content;
    font-weight: bold;
    font-size: 1.25em;
    padding: 0.5em 2em;
    transition: all 0.15s linear;

    border-radius: 15px;
    font-size: 26px;
    height: 61px;
    cursor: pointer;
    display: inline-block;
    box-sizing: border-box;
    font-weight: bold;
}



.field-bench{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 10px;
    background-image: url(/public/img/field_bench.png);
    background-size: 100% auto;
    background-position: center bottom;
    padding-bottom: 40px;
    background-repeat: no-repeat;
    margin-top: 20px;
}
.field-bench > div{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: calc((33vw - 6em) / 4 * 1.064);

    gap: 4px;

    position: relative;


    background: url(/public/img/field_seat.svg);
    background-position: center;
    background-size: 100% 100%;

}

.field-bench p{
    margin: 0px;
}
.field-bench a{
    color:inherit;
    display: block;
    text-decoration: unset;
}
.field-bench > div.disabled{
    opacity: 0.5;
}
.field-bench > div > h2{
    text-transform: uppercase;
    font-size: 40px;
    font-weight: bold;
}

.field-bench > div > h2:nth-child(1){
    font-size: 16px;
    margin: 0px;
    display: flex;
    height: 26px;
    margin-top: 5px;
    flex-direction: column;
    text-align: center;
    justify-content: center;
}
.field-bench > div > h2:last-child{
    font-size: 32px;
}
.field-bench > div > .cross{
    width: 26px;
    height: 26px;
    position: absolute;
    z-index: 99;
    top: 5px;
    left: 50%;
    transform: translateX(150%);
    cursor: pointer;
}
.field-bench > div > .cross img{
    width: 26px;
    height: 26px;
    background: white;
    border-radius: 100%;
}
.field-bench > div > .refresh{
    width: 26px;
    height: 26px;
    position: absolute;
    z-index: 99;
    top: 5px;
    left: calc(50%);
    transform: translateX(-250%);
    cursor: pointer;
}
.field-bench > div > .refresh img{
    width: 26px;
    height: 26px;
}
.field-bench > div.best::before{
    content: "";
    width: 26px;
    height: 26px;
    position: absolute;
    z-index: 99;
    bottom: 5px;
    left: 50%;
    transform: translateX(-250%);
    background-image: url("/public/img/fl_star.svg");
    background-size: 100%;
    background-repeat: no-repeat;
}
.field-bench > div > div.img{
    position: relative;
    height: 85px;
    cursor: pointer;
}
.field-bench > div > div.img a:nth-child(1){
    position: relative;
}
.field-bench > div > div.img img:nth-child(1){
    height: 85px;
}
.field-bench > div > div.img img:nth-child(2){
    height: 40%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.field-bench > div > div.img img:first-child:last-child{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -40%);
    height: 150%;
    z-index: 0;
}
.field-bench > div > .name{
    font-size: 12px;
    color: white;
    text-shadow: 0px 0px 4px black;
    text-align: center;
    font-weight: bold;
    width: 100%;
    z-index: 1;
}
.field-bench > div > .name > a{
    width: 100%;
}
.field-bench > div > .score{
    min-width: 55px;
    height: 1.5em;
    position: relative;
    text-align: center;
    font-size: 20px;
    display: flex;
    flex-direction: row;
    align-items: center;
    font-weight: 600;
    justify-content: center;
    border-radius: 100px;
    background: var(--fantasy-orange);
}


@media screen and (max-width: 1800px) {
    .field-bench > div{
        gap: 2px;
    }
    .field-bench > div > .score{
        font-size: 16px;
    }
    .field-bench > div > div.img a:nth-child(1) > img:nth-child(1){
        height: 70px;
    }
    /* .field-bench > div > h2:nth-child(1){
        font-size: 16px;
    }
    .field-height .table{
        height: calc(100% - 100px - 0em);
    }
    .field-height .table > .min-height--table{
        margin-bottom: 43px;
    }
    .field-height .table > .min-height--table table tr{
        height: calc(180px / 4);
    } */
}
@media screen and (max-width: 1000px){
}
@media screen and (max-width: 1400px){
    .field-bench > div > h2:nth-child(1){
        transform: translateY(2px);
    }
}
@media screen and (max-width: 1600px){
    .field-bench > div > h2:nth-child(1){
        font-size: 16px;
    }
    .field-bench > div > .name{
        font-size: 8px;
    }
    .field-bench > div > .cross{
        position: absolute;
        z-index: 99;
        top: 00px;
        right: 10px;
        left: unset;
        cursor: pointer;
        transform: unset;
    }
    .field-bench > div > .refresh{
        width: 20px;
        height: 20px;
        position: absolute;
        z-index: 99;
        top: 0px;
        left: 0px;
        cursor: pointer;
        transform: unset;
    }
    .field-bench > div > .cross img,
    .field-bench > div > .refresh img{
        width: 20px;
        height: 20px;
    }

    /* .field-bench > div.best::before{
        content: "";
        width: 20px;
        height: 20px;
        position: absolute;
        z-index: 99;
        right: 10px;
        transform: translateX(-250%);
        background-image: url("/public/img/fl_star.svg");
        background-size: 100%;
        background-repeat: no-repeat;
    } */
}
@media screen and (max-width: 1400px){
    .field-bench > div{
        min-height: 200px;
        gap: 8px;
    }
    .field-bench > div > h2:nth-child(1){
        font-size: 24px;
        margin-top: 0px;
    }
    .field-bench > div > .score{
        font-size: 20px;
    }
    .field-bench > div > .name{
        font-size: 14px;
    }
    .field-bench > div > div.img a:nth-child(1) > img:nth-child(1){
        height: 100px;
    }

    .field-bench > div > .cross{
        width: 20px;
        height: 20px;
        position: absolute;
        z-index: 99;
        top: 0px;
        left: 50%;
        right: unset;
        cursor: pointer;
        transform: translateX(150%);
    }
    .field-bench > div > .refresh{
        top: 0;
        width: 20px;
        height: 20px;
        position: absolute;
        z-index: 99;
        top: 0px;
        left: 50%;
        transform: translateX(-250%);
        cursor: pointer;
    }

}

.cross.js-app-replacing-mode-is-on{
    animation: replaceModeIsOn 2s linear infinite;
}

@keyframes replaceModeIsOn {
    0%{
        transform: rotate(0deg);
    }
    100%{
        transform: rotate(360deg);
    }
}

.popup--copy-link, .popup--invite{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 500px;
    max-width: calc(100% - 40px);
    height: auto;
    max-height: calc(100% - 40px);
    background: #3d3d3d;
    border-radius: 20px;
    padding: 20px;
    box-sizing: border-box;
    border: 3px solid white;
}
.popup--copy-link > img, .popup--invite > img{
    position: absolute;
    top: 5px;
    right: 5px;
    width: 26px;
    height: 26px;
    cursor: pointer;
}
.popup--copy-link, .popup--invite{
    text-align: center;
}
.popup--copy-link > span.link{
    border-radius: 20px;
    padding: 10px 20px;
    box-sizing: border-box;
    width: fit-content;
    display: block;
    max-width: calc(100%);
    padding-right: 50px;
    margin-left: auto;
    margin-right: auto;
    background-color: var(--fantasy-orange);
    background-image:  url(/public/img/copy.svg);
    background-size: auto 30px;
    background-repeat: no-repeat;
    background-position: right 10px center;
    color: white;
    font-weight: bold;
    /* text-transform: uppercase; */
    position: relative;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 40px;
}

.popup--invite > div{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 20px;
    font-size: 0.5em;
    flex-wrap: wrap;
}
.popup--invite > div > .button{
    width: 100%;
    text-align: center;
    font-size: 20px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.verified{
    display: flex!important;
    flex-direction: row;
    gap: 0.5em;
    align-content:center;
    /* justify-content: center; */
}
td.verified{
    height: 41px;
    align-items: center;
}
.verified-tooltip{
    height: 1em!important;
    width: 2em!important;
    position: relative;
}
.verified-tooltip > img{
    height: 1em!important;
    width: 1em!important;
    cursor: pointer;
}
.verified-tooltip > div{
    display: none;
    position: absolute;
    top: 0px;
    left: calc(100% - 0.5em);
    padding: 0.5em;
    flex-direction: column;
    gap: 0.5em;

    border: 2px solid var(--fantasy-orange);
    border-radius: 0.5em;
    background-color: rgba(0, 0, 0, 0.75);

    width: max-content;
    z-index: 99;
}
.verified-tooltip:hover > div{
    display: flex;
}
.verified-tooltip > div > p,
.verified-tooltip > div > a,
.verified-tooltip > div > span{
    margin: 0px;
    font-size: 0.75em;
    font-weight: 500;
}
/*.verified-tooltip > div > a{
    text-decoration: underline!important;
}*/
@media screen and (max-width: 1400px) {
    .verified-tooltip > div{
        gap: 1em;
        max-width: calc(50vw);
    }
    .verified-tooltip > div > p,
    .verified-tooltip > div > a,
    .verified-tooltip > div > span{
        font-size: 1em;
    }
}
.label-checkbox > input{
    display: none;
}
.label-checkbox > input+span{
    color: white;
    background: black;
    transition: all 0.15s ease-in-out;
    border: 3px solid var(--fantasy-orange);
    border-radius: 1em;
    padding: 0.35em 1em;
    font-size: 1.5em;
    cursor: pointer;
    width: 200px;
    display: block;
    text-align: center;
    box-sizing: border-box;


    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                        supported by Chrome, Edge, Opera and Firefox */
}
.label-checkbox > input:checked+span{
    color: black;
    background: var(--fantasy-orange);
    border-color: black;
    font-weight: 600;
}