.green-text{
    color: #00ff00;
}

.red-text{
    color: #ff0000;
}

.yellow-text{
    color: #ffff00;
}
.crayola-text{
    color: #D3CB89;
    font-size: 10px;
}

.blue-text{
    color: #A9CEFC;
}

.magenta-text{
    color: #ff00ff;
}
.table-1, .table-2, .table-3{
    background: #4a4a4a;
    padding: 5px 4px;
    border-radius: 3px;
}

.f-table {
    display: flex;
    border: 2px solid white;
    font-size: 12px;
    background: black;
    border-radius: 4px;
}

.left-block{
    border-right: 1px solid white;
}
.left-block{
    display: inline-block;
    width: max-content;
}
.right-block {
    display: inline-block;
    width: max-content;
}

.left-block .table-row,
.right-block .table-row {
    display: flex;
    justify-content: center;
}

.table-cell {
    padding: 0px 4px;
    text-align: center;
    font-weight: bold;
    line-height: 12px;
}
.right-block .table-cell{
    width: 50%;
}
.left-block .table-row{
    padding: 1px;
}
.right-block .table-row{
    padding: 1px;
}
.left-block .table-cell{
    width: 20%;
}

.s-11{
    font-weight: normal;
    font-size: 11px;
}
.add-on-hover {
    z-index: 100000;
    position: relative;
    opacity: 1;
    display: block;
}

.main-table-1{
    display: flex;
    gap: 4px;
    line-height: 13px;
    font-size: 11px;
}
.main-table-13{
    display: flex;
    gap: 4px;
    line-height: 13px;
    font-size: 11px;
    justify-content: center;
}
.table-header{
    font-weight: 700;
    width: 50%;
    height: 16px;
}
.table-1-table{
    border: 1px solid;
    background: black;
}
.table-1-row{
    display: flex;
    justify-content: center;
}
.table-1-col-first{
    width: 47px;
    text-align: center;
}
.table-1-col{
    width: 14%;
    display: flex;
}
.table-1-cell{
    padding: 2px 4px;
}
.border-bottom{
    border-bottom: 1px solid;
}
.bg-gray{
    background: #373B3F;
}
.table-4-row .table-1-col {
    width: 25%;
    display: flex;
}
.table-4-col-first{
    width: 43%;
    text-align: center;
}
.table-4-row .table-1-cell {
    padding: 2px 6px;
}
.table-4-col{
    width: 22%;
    display: flex;
}
.table-5-col-first{
    width: 30%;
    text-align: center;
}
.table-8-col-first{
    width: 35%;
    text-align: center;
}
.table-5-col{
    width: 19%;
    display: flex;
    text-align: center;
    justify-content: center;
}
.table-11-col{
    width: 44%;
    display: flex;
    text-align: center;
    justify-content: center;
}
.table-11-col-first{
    width: 48px;
    display: flex;
    text-align: center;
    justify-content: center;
}
.table-12-col-first{
    width: 40px;
    display: flex;
    justify-content: center;
}
.table-12-col{
    width: 34%;
    display: flex;
    justify-content: center;
}
.table-12s-col-first{
    width: 45px;
    display: flex;
    text-align: center;
    justify-content: center;
}
.table-12s-col{
    width: 34%;
    display: flex;
    justify-content: center;
}

.table-13-col-first{
    width: 34px;
    text-align: center;
}
.table-13-col{
    width: 27%;
    display: flex;
    text-align: center;
    justify-content: center;
}
.table-14-col-first{
    width: 40px;
    text-align: center;
}
.table-14-col{
    width: 19%;
    display: flex;
    text-align: center;
    justify-content: center;
}
.table-14f-col-first{
    width: 31px;
    text-align: center;
}
.table-14-table{
    margin-top: 7px;
    width: 100px;
    border: 1px solid;
    background: black;
}
body{
transition: all 0.5s ease;
}
.table-hovering .player-budged2,
.table-hovering .player,
.table-hovering .center-cards,
.table-hovering .summ{
    pointer-events: none;
    opacity: 0.1;
}

.table-hovering .delete-player,
.table-hovering .dont-generate{
    pointer-events: none;
    display: none;
}
.z-index-hover{
    z-index: 1;
}
.table-hovering .z-index-hover{
    z-index: 0!important;
}

.add-on-hover {
    z-index: 100000;
    position: relative;
    opacity: 1;
    display: block;
}

.hover-active {
    pointer-events: auto;
}
.bt-15{
    bottom:15px;
}

.table-15-col-first{
    width: 50px;
    text-align: center;
}