.balls {
    height: 60px;
    padding: 10px;
}
.ball1, .ball2, .ball3, .ball4, .ball5, .ball6, .ball7, .ball8, .ball9 {
    display: inline-block;
    width: 100%;
    height: 100%;
    margin: 0;
    border-radius: 50%;
    position: relative;
    background: radial-gradient(circle at 50% 120%, #323232, #0a0a0a 80%, #000000 100%);
    float: left;
    cursor: move;
}
.ball1 {background: radial-gradient(circle at 50% 120%, #807d80, #f7f6e7 80%, #fff6f6 100%);}
.ball3 {background: radial-gradient(circle at 50% 120%, #1b12ff, #9810b0 80%, #110aff 100%);}
.ball4 {background: radial-gradient(circle at 50% 120%, #80f880, #0030ff 80%, #804000 100%);}
.ball5 {background: radial-gradient(circle at 50% 120%, #148009, #a7f715 80%, #9fff4d 100%);}
.ball6 {background: radial-gradient(circle at 50% 120%, #f8f800, #f7f314 80%, #807c0b 100%);}
.ball7 {background: radial-gradient(circle at 50% 120%, #f89d10, #f77c02 80%, #806109 100%);}
.ball8 {background: radial-gradient(circle at 50% 120%, #ff0000, #f73302 80%, #804000 100%);}
.ball9 {background: radial-gradient(circle at 50% 120%, #80272c, #f72f29 80%, #ff1320 100%);}
.ball1:before, .ball2:before, .ball3:before, .ball4:before, .ball5:before, .ball6:before, .ball7:before, .ball8:before, .ball9:before {
    content: "";
    position: absolute;
    background: radial-gradient(circle at 50% 120%, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0) 70%);
    border-radius: 50%;
    bottom: 2.5%;
    left: 5%;
    opacity: 0.6;
    height: 100%;
    width: 90%;
    -webkit-filter: blur(5px);
    z-index: 2;
}
.ball1:after, .ball2:after, .ball3:after, .ball4:after, .ball5:after, .ball6:after, .ball7:after, .ball8:after, .ball9:after {
    width: 100%;
    height: 100%;
    content: "";
    position: absolute;
    top: 5%;
    left: 10%;
    border-radius: 50%;
    background: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8) 14%, rgba(255, 255, 255, 0) 12%);
    -webkit-transform: translateX(-15px) translateY(-15px) skewX(-20deg);
    -moz-transform: translateX(-15px) translateY(-15px) skewX(-20deg);
    -ms-transform: translateX(-15px) translateY(-15px) skewX(-20deg);
    -o-transform: translateX(-15px) translateY(-15px) skewX(-20deg);
    transform: translateX(-15px) translateY(-15px) skewX(-20deg);
    -webkit-filter: blur(5px);
}
.ball1 .digit1, .ball2 .digit2, .ball3 .digit3, .ball4 .digit4, .ball5 .digit5, .ball6 .digit6, .ball7 .digit7, .ball8 .digit8, .ball9 .digit9 {
    width: 20px;
    height: 20px;
    margin: 30%;
    background: white;
    border-radius: 50%;
    -webkit-transform: translateX(17px) translateY(-15px) skewX(15deg) skewY(2deg);
    -moz-transform: translateX(17px) translateY(-15px) skewX(15deg) skewY(2deg);
    -ms-transform: translateX(17px) translateY(-15px) skewX(15deg) skewY(2deg);
    -o-transform: translateX(17px) translateY(-15px) skewX(15deg) skewY(2deg);
    transform: translateX(6px) translateY(-6px) skewX(15deg) skewY(2deg);
    position: absolute;
}
.ball1 .digit1:before, .ball2 .digit2:before, .ball3 .digit3:before, .ball4 .digit4:before, .ball5 .digit5:before, .ball6 .digit6:before, .ball7 .digit7:before, .ball8 .digit8:before, .ball9 .digit9:before {
    display: block;
    position: absolute;
    text-align: center;
    height: 10px;
    width: 15px;
    left: 10px;
    margin-left: -7px;
    top: 7px;
    margin-top: -7px;
    color: black;
    font-family: Arial;
    font-size: 14px;
    line-height: 18px;
}
.ball1 .digit1:before {content: "1"}
.ball2 .digit2:before {content: "2"}
.ball3 .digit3:before {content: "3"}
.ball4 .digit4:before {content: "4"}
.ball5 .digit5:before {content: "5"}
.ball6 .digit6:before {content: "6"}
.ball7 .digit7:before {content: "7"}
.ball8 .digit8:before {content: "8"}
.ball9 .digit9:before {content: "9"}
.ball1 .shadow, .ball2 .shadow, .ball3 .shadow, .ball4 .shadow, .ball5 .shadow, .ball6 .shadow, .ball7 .shadow, .ball8 .shadow, .ball9 .shadow {
    position: absolute;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 50% 50%, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0) 50%);
    -webkit-transform: rotateX(90deg) translateZ(-27px);
    -moz-transform: rotateX(90deg) translateZ(-27px);
    -ms-transform: rotateX(90deg) translateZ(-27px);
    -o-transform: rotateX(90deg) translateZ(-27px);
    transform: rotateX(90deg) translateZ(-27px);
    z-index: -1;
}
.stage {
    width: 50px;
    height: 50px;
    display: inline-block;
    margin: 1px -10px 5px 5px;
    float: left;
    -webkit-perspective: 200px;
    -moz-perspective: 200px;
    -ms-perspective: 200px;
    -o-perspective: 200px;
    perspective: 200px;
    -webkit-perspective-origin: 50% 50%;
    -moz-perspective-origin: 50% 50%;
    -ms-perspective-origin: 50% 50%;
    -o-perspective-origin: 50% 50%;
    perspective-origin: 50% 50%;
}
.header_b {
    text-align: center;
    font: bold 20px Verdana;
    color: darkgoldenrod;
}
.home, .draw, .away {
    width: 60px;
    height: 60px;
    border: 2px solid darkgoldenrod;
    float: left;
    padding: 0;
    border-radius: 10%;
}
.container {
    width: 450px;
    height: 60px;
    padding-inline-start: 0;
    border: 2px solid darkgoldenrod;
    margin: 0 0 0 0;
    border-radius: 6px;
}
.team {
    float: left;
    width: 135px;
    padding: 8px;
    line-height: 1.1rem;
}
.time {
    width: 450px;
}