/*
* Styles for game page
*/

.game-wrapper {
padding: 1.32em 0 5.2em 0;
max-width: 640px;
margin: 0 auto;
}

h1 {
margin: 0 0 1.2em 0;
text-align: center;
font-size: 1.32em;
font-weight: normal;
}


.games-stat-flags {
margin: 0 auto;
width: 100%;
max-width: 360px;
}


.game-league {
font-size: 1.32em;
margin: 0 0 0.4em 0;
text-align: center;
overflow: hidden;
}

.game-league2 {
font-size: 1.20em;
margin: 0 0 0.4em 0;
text-align: center;
overflow: hidden;
}

.game-league span {
white-space: nowrap;
}

span.game-league-small {
font-size: 1.12rem;
}

.game-time {
margin-bottom: 0.6em;
text-align: center;
}

.game-time span {
display: inline-block;
padding-top: 0.4em;
}

.team-flags {
width: 100%;
margin: 0;
}

.team-flag-left, .team-flag-right {
padding: 0;
margin: 0;
width: 50%;
text-align: center;
}

.team-flag-left {
float: left;
}

.team-flag-right {
float: right;
}

.team-flags h1 {
font-size: 1.12em;
margin: 0.48em 0 0 0;
text-align: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
}

.team-flags h1 span.country {
white-space: nowrap;
font-size: 0.82em;
}

div.football-team-div, div.missing-team-div {
height: 116px;
}

div.national-team-div {
height: 66px;
}

img.football-team, img.missing-team {
width: 76px;
height: 76px;
padding: 12px;
border-radius: 50%;
background: var(--image-bg-color);
box-shadow: var(--game-box-shadow);
}

img.national-team {
width: 88px;
height: 66px;
background: var(--image-bg-color);
box-shadow: var(--game-box-shadow);
}

.game-result, .game-extended-result {
line-height: 1.4em;
font-weight: bold;
text-align: center;
}

.game-result {
margin-top: 0.2em;
font-size: 1.2em;
}

.game-secure-result {
line-height: 1.4em;
font-size: 1.2em;
text-align: center;
color: var(--attention-color);
}

.game-extended-result {
margin-bottom: -0.8em;
}

div.final-game-result, div.previous-game-result {
font-weight: normal;
line-height: 1.4em;
text-align: center;
}

div.final-game-result {
margin-top: 1.4em;
margin-bottom: 0.32em;
font-weight: bold;
}

span.final-game-result-score {
font-weight: normal;
}

span.previous-game-result-score {
display: inline-block;
padding: 0 0.8em;
font-weight: bold;
}

.games-stat-wrapper {
width: 100%;
margin: 0 auto;
}

.live-wrapper {
margin: 6px auto -16px auto;
text-align: center;
color: var(--game-live-color);
}

.live-score {
margin-bottom: 6px;
}

.bl {
animation: blink 1.2s step-end infinite;
}

@keyframes blink {
50% { opacity: 0; }
}


table.team-info {
width: 100%;
margin: 3.2em auto 0 auto;
border-collapse: collapse;
}

table.team-info th {
padding-left: 0.8em;
line-height: 2.8em;
text-align: left;
background: var(--game-title-bg-color);
color: var(--game-title-color);
}

table.team-info td {
line-height: 1.8em;
padding-right: 0.4em;
vertical-align: top;
}

table.team-info td.label {
width: 5%;
text-align: right;
padding-right: 0.4em;
padding-left: 1.2em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

table.team-info td.title {
line-height: 2.4em;
text-align: left;
padding-left: 0.8em;
background: var(--game-bg-color);
}

table.team-info a {
text-decoration: none;
color: var(--link-color);
}

table.team-info a:visited {
color: var(--link-color);
}

table.team-info a:hover {
text-decoration: underline;
}


h2.games-title {
margin-top: 4.2em;
margin-bottom: 0.6em;
font-size: 1em;
padding-left: 0.8em;
line-height: 2.8em;
text-align: left;
font-weight: bold;
background: var(--game-title-bg-color);
color: var(--game-title-color);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}


.games-stat-form-wrapper {
text-align: center;
margin: 0.8em auto 0.4em auto;
}

.games-stat-form {
display: inline-block;
height: 0.88em;
}

span.form-ln {
display: block;
width: 0.75em;
height: 0.88em;
margin-right: 0.25em;
float: right;
}

span.form-bl {
display: block;
width: 0.62em;
height: 0.75em;
}

.games-stat-no-data {
font-size: 1.2em;
text-align: center;
color: var(--attention-color);
margin: 1em 0 1.4em 0;
}





table.games-stat {
width: 100%;
margin: -0.6em auto 3.2em auto;
border-collapse: collapse;
}

table.games-stat td {
line-height: 2.6em;
border-bottom: 1px solid var(--game-border-color);
}

table.games-stat td.date {
width: 5.4em;
padding-left: 0.4em;
white-space: nowrap;
}

table.games-stat td.hteam {
text-align: right;
padding-right: 0.4em;
vertical-align: top;
}

table.games-stat td.ateam {
text-align: left;
padding-left: 0.4em;
vertical-align: top;
}

table.games-stat td.result {
width: 3.4em;
white-space: nowrap;
text-align: center;
font-weight: bold;
}

table.games-stat td.win {
background: var(--win-bg-color);
}

table.games-stat td.draw {
background: var(--draw-bg-color);
}

table.games-stat td.loss {
background: var(--loss-bg-color);
}




table.next-games {
width: 100%;
margin: -0.6em auto 3.2em auto;
border-collapse: collapse;
}

table.next-games td {
line-height: 2.6em;
border-bottom: 1px solid var(--game-border-color);
}

table.next-games td.date {
width: 5.4em;
padding-left: 0.4em;
white-space: nowrap;
}

table.next-games td.hteam {
text-align: right;
padding-right: 0.4em;
vertical-align: top;
}

table.next-games td.ateam {
text-align: left;
padding-left: 0.4em;
vertical-align: top;
}

table.next-games td.result {
width: 1.2em;
white-space: nowrap;
text-align: center;
}




table.games-ostat {
width: 100%;
margin: -1.8em auto 3.2em auto;
border-collapse: collapse;
}

table.games-ostat td {
line-height: 1.6em;
font-weight: bold;
text-align: center;
width: 16%;
}

table.games-ostat td.space {
width: 4%;
}

table.games-ostat td.win {
background: var(--win-bg-color);
}

table.games-ostat td.draw {
background: var(--draw-bg-color);
}

table.games-ostat td.loss {
background: var(--loss-bg-color);
}

table.games-ostat td.ou {
background: var(--game-bg-color);
border-left: 1px solid var(--game-title-bg-color);
}

table.games-ostat td.ou1 {
border-left: 1px solid var(--game-bg-color);
}





table.perf {
width: 100%;
margin: -0.6em auto 0 auto;
border-collapse: collapse;
table-layout: fixed;
}

table.perf td.row1 {
width: 28%;
}

table.perf td.row2 {
width: 36%;
}

table.perf td {
line-height: 2.6em;
}

table.perf td.caption {
padding-left: 0.8em;
}

table.perf td.title {
text-align: center;
background: var(--game-bg-color);
color: var(--game-title-color);
padding-left: 0.12em;
padding-right: 0.12em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

table.perf td.space {
padding-bottom: 1.2em;
}

table.perf td.border {
border-bottom: 1px solid var(--game-border-color);
}

table.perf td.pos {
text-align: center;
}

table.perf td.form {
text-align: center;
}

table.perf td.form .form-inner {
display: inline-block;
text-align: left;
}

table.perf td.form .form-games, table.perf td.form .form-goals {
display: inline-block;
margin-left: 0.48em;
margin-right: 0.12em;
height: 0.82rem;
line-height: 0.82rem;
}

table.perf td.form .form-games {
font-size: 0.72em;
vertical-align: 0.12em;
}

table.perf td.form .form-goals {
font-size: 0.42em;
vertical-align: 0.28em;
}




table.perft {
width: 100%;
margin: -0.6em auto 0 auto;
border-collapse: collapse;
table-layout: fixed;
}

table.perft td.row1 {
width: 44%;
}

table.perft td.row2 {
width: 28%;
}

table.perft td {
line-height: 2.6em;
border-bottom: 1px solid var(--game-border-color);
}

table.perft td.caption {
padding-left: 0.8em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

table.perft td.title {
text-align: center;
background: var(--game-bg-color);
padding-left: 0.12em;
padding-right: 0.12em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

table.perft td.space {
padding-top: 1.2em;
}

table.perft td.spaceb {
padding-bottom: 1.2em;
}

table.perft td.pos {
text-align: center;
}




table.lperf {
width: 100%;
margin: -0.6em auto 0 auto;
border-collapse: collapse;
}

table.lperf th {
line-height: 2.6em;
background: var(--game-title-bg-color);
color: var(--game-title-color);
text-align: left;
padding-left: 0.8em;
white-space: nowrap;
overflow: hidden;
}

table.lperf td {
line-height: 2.6em;
border-bottom: 1px solid var(--game-border-color);
}

table.lperf td.label {
padding-left: 0.8em;
vertical-align: top;
}

table.lperf td.data {
text-align: right;
padding-right: 0.8em;
white-space: nowrap;
width: 10%;
}

table.lperf td.space {
padding-bottom: 1.2em;
}

table.lperf td.caption {
text-align: center;
background: var(--game-bg-color);
}







/*
* Styles about table with league games
*/
table.lgames {
width: 100%;
margin: -0.6em auto 0 auto;
border-collapse: collapse;
}

table.lgames th {
line-height: 2.6em;
text-align: center;
font-weight: bold;
background: var(--game-bg-color);
color: var(--game-title-color);
vertical-align: top;
}

table.lgames td {
line-height: 2.6em;
padding-left: 0.62em;
padding-right: 0;
border-bottom: 1px solid var(--game-border-color);
}

table.lgames td.selected, table.lgames tr.team {
background: var(--game-selected-color);
}

table.lgames td.position {
width: 1.52em;
white-space: nowrap;
text-align: right;
padding-left: 0;
padding-right: 0.38em;
}

table.lgames td.team {
vertical-align: top;
}

table.lgames td.result {
width: 24%;
font-weight: bold;
white-space: nowrap;
text-align: center;
padding-left: 0;
padding-right: 0;
}

table.lgames td.win {
background: var(--win-bg-color);
}

table.lgames td.draw {
background: var(--draw-bg-color);
}

table.lgames td.loss {
background: var(--loss-bg-color);
}

table.lgames tr.group td {
height: 0;
line-height: 0;
padding: 0;
border-top: 2px solid var(--game-title-bg-color);
border-bottom: 2px solid var(--game-title-bg-color);
}


table.chrono {
width: 100%;
margin: -0.6em auto 0 auto;
border-collapse: collapse;
table-layout: fixed;
}

table.chrono td {
line-height: 2.6em;
border-bottom: 1px solid var(--game-border-color);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

table.chrono td.team {
width: 28%;
padding-left: 0.32em;
padding-right: 0.12em;
}

table.chrono td.games {
height: 1.4em;
line-height: 1.4em;
padding-top: 1em;
}

table.chrono td.games span.pr {
display: inline-block;
width: 5px;
height: 10px;
margin-left: 1px;
border-radius: 1px;
}

table.chrono td.games span.win {
background: var(--win-color);
}

table.chrono td.games span.draw {
background: var(--draw-color);
}

table.chrono td.games span.loss {
background: var(--loss-color);
}

table.chrono td.games span.empty {
background: var(--game-title-bg-color);
}



/*
* Styles about table with odds
*/
table.odds {
width: 100%;
margin: -0.6em auto 3.2em auto;
border-collapse: collapse;
}

table.odds th {
line-height: 2.8em;
text-align: center;
background: var(--game-bg-color);
vertical-align: top;
}

table.odds th.odds-type {
text-align: left;
padding-left: 0.8em;
}

table.odds td {
line-height: 2.6em;
border-bottom: 1px solid var(--game-border-color);
}

table.odds td.bookmaker {
padding-left: 0.8em;
}

table.odds td.bookmaker img {
vertical-align: -8px;
border-radius: 2px;
}

table.odds td.odd {
width: 52px;
white-space: nowrap;
text-align: right;
padding-right: 12px;
}

table.odds td.sh {
width: 46px;
padding-right: 8px;
}

table.odds td.noodd {
width: 32px;
padding-right: 26px;
}

table.odds td.cs {
width: 92px;
white-space: nowrap;
text-align: center;
}

table.odds td.goals {
width: 92px;
white-space: nowrap;
text-align: center;
}

table.odds td.gsh {
width: 52px;
}

table.odds td.odda {
width: 64px;
white-space: nowrap;
text-align: right;
}

table.odds td.sha {
width: 54px;
}

table.odds td.odda a {
display: block;
padding-right: 12px;
text-decoration: none;
color: var(--link-color);
}

table.odds td.sha a {
padding-right: 8px;
}

table.odds td.odda a:hover {
background: var(--game-title-bg-color);
}

table.odds td.stotext {
padding-left: 0.8em;
vertical-align: top;
}

table.odds td.stotip {
text-align: center;
font-weight: bold;
border-bottom: none
}




.bookie {
width: 82px;
height: 26px;
}

.b_1xbet {
width: 82px;
height: 16px;
margin-bottom: 5px;
}

.b_unibet {
width: 92px;
height: 26px;
margin-left: -5px;
}

.b_bwin {
background: #000;
}


.odds-links {
text-align: center;
}

.odds-links a {
text-decoration: none;
color: var(--link-color);
}

.odds-links a:visited {
color: var(--link-color);
}

.odds-links a:hover {
text-decoration: underline;
}

.odds-hidden {
display: none;
}


@media screen and (max-width: 420px) {
table.odds td.goals {
width: 72px;
}
}

@media screen and (max-width: 360px) {
table.odds th.odds-type {
text-align: left;
padding-left: 0.4em;
}
table.odds td.bookmaker {
padding-left: 0.4em;
}
table.odds td.odd {
width: 46px;
}
table.odds td.sh {
width: 42px;
padding-right: 6px;
}
table.odds td.sha {
width: 48px;
}
table.odds td.goals {
width: 62px;
}
table.odds td.gsh {
width: 42px;
}
}


/*
* Styles about table with standing
*/
table.standing {
width: 100%;
margin: -0.6em 0 0 0;
border-collapse: collapse;
}

table.standing th {
line-height: 2.6em;
text-align: center;
font-weight: bold;
background: var(--game-bg-color);
color: var(--game-title-color);
}

table.standing td {
line-height: 2.6em;
padding-left: 0.62em;
padding-right: 0;
border-bottom: 1px solid var(--game-border-color);
}

table.standing tr.team {
background: var(--game-selected-color);
}

table.standing td.team {
vertical-align: top;
}

table.standing td.position {
width: 1.52em;
white-space: nowrap;
text-align: right;
padding-left: 0;
padding-right: 0.38em;
}

table.standing td.matches, table.standing td.goals, table.standing td.points {
width: 2.00em;
white-space: nowrap;
text-align: right;
padding-left: 0;
padding-right: 1.00em;
}

table.standing td.diff {
width: 2.26em;
white-space: nowrap;
text-align: right;
padding-left: 0;
padding-right: 0.76em;
}

table.standing td.form {
width: 5.12em;
white-space: nowrap;
text-align: left;
padding-left: 0.50em;
padding-right: 0.12em;
}

table.standing td.form span.form-section {
display: inline-block;
}

table.standing tr.group td {
height: 0;
line-height: 0;
padding: 0;
border-top: 2px solid var(--game-title-bg-color);
border-bottom: 2px solid var(--game-title-bg-color);
}


@media screen and (max-width: 1200px) {
table.standing td.matches, table.standing td.goals, table.standing td.points {
width: 1.88em;
padding-right: 0.88em;
}
table.standing td.diff {
width: 2.00em;
padding-right: 0.72em;
}
}


@media screen and (max-width: 640px) {
table.standing .hide-form {
display: none
}
}


@media screen and (max-width: 639px) {
table.standing td.matches, table.standing td.goals, table.standing td.points {
width: 1.50em;
padding-right: 0.75em;
}
table.standing td.diff {
width: 2.00em;
padding-right: 0.50em;
}
}


@media screen and (max-width: 420px) and (min-width: 401px) {
table.standing td.matches, table.standing td.goals {
padding-right: 0.50em;
}
}


@media screen and (max-width: 400px) and (min-width: 361px) {
table.standing td.matches, table.standing td.goals {
padding-right: 0.38em;
}
}


@media screen and (max-width: 400px) {
table.standing .hide-goals {
display: none
}
}


@media screen and (max-width: 360px) {
table.standing td.matches, table.standing td.goals  {
padding-right: 0.32em;
}
}




/*
* Standing form and standing colors
*/
span.form-el {
display: block;
width: 0.62em;
height: 0.75em;
margin-right: 0.2em;
float: right;
}

.stp7, .stp11, .stp13, .stp17, .stp20, .stp30 {
background: var(--stp01);
}

.stp6, .stp12, .stp15, .stp18 {
background: var(--stp02);
}

.stp9, .stp14, .stp19, .stp22 {
background: var(--stp03);
}

.stp24, .stp31 {
background: var(--stp04);
}

.stp1, .stp32 {
background: var(--stp05);
}

.stp2, .stp5, .stp23 {
background: var(--stp06);
}

.stp4, .stp8, .stp10, .stp16, .stp21 {
background: var(--stp07);
}

.stp3 {
background: var(--stp08);
}

.stp25 {
background: var(--stp09);
}

.stp26, .stp28 {
background: var(--stp10);
}

.stp27, .stp29 {
background: var(--stp11);
}


span.form-win {
background: var(--win-color);
}

span.form-draw {
background: var(--draw-color);
}

span.form-loss {
background: var(--loss-color);
}

span.empty {
background: var(--game-title-bg-color);
}

.team-link {
width: 100%;
text-align: right;
margin: -1.8em auto 3.2em auto;
}

.team-link a {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
text-decoration: none;
color: var(--link-color);
}

.team-link a:visited {
color: var(--link-color);
}

.team-link a:hover {
text-decoration: underline;
}



.bet-link {
margin-top: 4.2em;
text-align: center;
font-size: 1.2em;
color: var(--attention-color);
}

.bet-link a {
text-decoration: none;
color: var(--link-color);
}

.bet-link a:visited {
color: var(--link-color);
}

.bet-link a:hover {
text-decoration: underline;
}

.bet-closed {
margin-top: 4.2em;
text-align: center;
font-size: 1.2em;
color: var(--attention-color);
}

.open-bet {
margin-top: 4.2em;
text-align: center;
line-height: 2em;
}

.open-bet-title {
font-size: 1.2em;
color: var(--attention-color);
}

.open-bet-data {
font-weight: bold;
color: var(--info-color);
}

@media screen and (max-width: 420px) {
.bet-link {
font-size: 1.12em;
}
}

@media screen and (max-width: 380px) {
.bet-link {
font-size: 1em;
}
}



.view-tips {
margin: 2.92em 0 -0.72em 0;
text-align: center;
font-size: 1.2em;
color: var(--attention-color);
}

.view-tips-2 {
margin-top: 3.2em;
margin-bottom: -2.8em;
}

.view-tips a {
text-decoration: none;
color: var(--link-color);
}

.view-tips a:visited {
color: var(--link-color);
}

.view-tips a:hover {
text-decoration: underline;
}

@media screen and (max-width: 420px) {
.view-tips {
font-size: 1.12em;
}
}

@media screen and (max-width: 380px) {
.view-tips {
font-size: 1.08em;
}
}




.dc {
position: relative;
max-width: 100%;
display: block;
}

.dce {
position: absolute;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
width: 100%;
top: 0;
left: 0;
}
