.type-1 {
    --bs-table-color: lightgreen;
    --bs-table-striped-color: lightgreen;
}

.type-4 {
    --bs-table-color: cyan;
    --bs-table-striped-color: cyan;
}

.type-7 {
    --bs-table-color: coral;
    --bs-table-striped-color: coral;
}

.type-9 {
    --bs-table-color: yellow;
    --bs-table-striped-color: yellow;
}

table[data-sortable] th {
    text-align: center;
}

table[data-sortable] th:not([data-sortable="false"]) {
    cursor: pointer;
}

table[data-sortable] th:after {
    content: "";
    visibility: hidden;
    display: inline-block;
    vertical-align: inherit;
    height: 0;
    width: 0;
    border-width: 5px;
    border-style: solid;
    border-color: transparent;
    margin-right: 1px;
    margin-left: 10px;
    float: right;
}

table[data-sortable] th[data-sorted="true"]:after {
    visibility: visible;
}

table[data-sortable] th[data-sorted-direction="descending"]:after {
    border-top-color: white;
    margin-top: 8px;
}

table[data-sortable] th[data-sorted-direction="ascending"]:after {
    border-bottom-color: white;
    margin-top: 3px;
}

#prog {
    background: url(images/back.jpg) no-repeat;
    border-collapse: unset;
    width: 700px;
    height: 526px;
    padding: 13px;
}

#prog2 {
    font: 12px Century Gothic;
    width: 100%;
    height: 100%;
    color: white;
}

#prog2 img {
    width: 50px;
}

#prog2 .title {
    background: url(images/title.png) no-repeat;
    height: 30px;
    padding: 4px 10px 10px;
    font-size: 14px;
}

#prog2 .tabtitle {
    background: url(images/tabtitle.png) no-repeat;
    height: 25px;
}

#prog2 .tabtitle td {
    text-align: center;
    width: 26px;
}

#prog2 .num {
    background: url(images/num.png) no-repeat;
    height: 25px;
    width: 28px;
    text-align: center;
}

#prog2 .name {
    background: url(images/name.png) no-repeat;
    padding-left: 10px;
}

#prog2 .bieg {
    background: url(images/bieg.png) no-repeat;
    width: 26px;
}

#prog2 .blue {
    background: url(images/blue.png) no-repeat;
    width: 26px;
    text-align: center;
}

#prog2 .red {
    background: url(images/red.png) no-repeat;
    width: 26px;
    text-align: center;
}

#prog2 .white {
    background: url(images/white.png) no-repeat;
    width: 26px;
    color: black;
    text-align: center;
}

#prog2 .yellow {
    background: url(images/yellow.png) no-repeat;
    width: 26px;
    color: black;
    text-align: center;
}

#prog2 .green {
    background: url(images/green.png) no-repeat;
    width: 26px;
    text-align: center;
}

#prog2 .black {
    width: 26px;
    text-align: center;
}

#prog2 .sum {
    background: url(images/sum.png) no-repeat 1px 0;
    width: 39px;
    text-align: center;
}

#prog2 .bon {
    background: url(images/bon.png) no-repeat 1px 0;
    text-align: center;
    width: 26px;
}

#prog2 .team {
    background: url(images/team.png) no-repeat;
}

#prog2 .team img {
    padding: 0 5px;
    float: left;
}

#prog2 .summa {
    background: url(images/summa.png) no-repeat;
    text-align: center;
    font-size: 24px;
}

#prog2 .point {
    background: url(images/point.png) no-repeat 0 -1px;
    height: 22px;
    text-align: center;
}

#prog2 .points {
    background: url(images/points.png) no-repeat 0 -1px;
    height: 22px;
    text-align: center;
}

#prog2 .teamname {
    position: relative;
    font-weight: bold;
    font-size: 14px;
    margin-top: 3px;
    padding-left: 10px;
    left: 5px;
}