/*
* Styles for game page
*/

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

#game-details-wrapper {
max-width: 580px;
margin: 0 auto;
font-size: 16px;
}

@media screen and (max-width: 420px) {
#game-details-wrapper {
font-size: 14px;
}
}


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


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

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

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


.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.2em;
margin: 0.48em 0 0 0;
text-align: center;
overflow: hidden;
}

img.football-team, img.missing-team {
width: 64px;
height: 64px;
}

img.national-team {
width: 64px;
}

.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-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: #d64541;
}

.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.2em;
text-align: left;
background: #2980b9;
color: #ffffff;
}

table.team-info th:first-of-type {
border-radius: 2px 0 0 0;
}

table.team-info th:last-of-type {
border-radius: 0 2px 0 0;
}

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 {
text-align: left;
padding-left: 0.8em;
background: #ecf0f1;
}

table.team-info td.title-row {
background: #ecf0f1;
}

table.team-info a {
text-decoration: none;
color: #2455c3;
}

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

table.team-info a:visited {
color: #2455c3;
}

@media screen and (max-width: 420px) {
table.team-info th:first-of-type, table.team-info th:last-of-type {
border-radius: 0;
}
}



h2.games-title {
margin-top: 3.2em;
margin-bottom: 0.6em;
font-size: 1em;
padding-left: 0.8em;
line-height: 2.2em;
text-align: left;
font-weight: bold;
background: #2980b9;
color: #ffffff;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
border-radius: 2px 2px 0 0;
}

@media screen and (max-width: 420px) {
h2.games-title {
border-radius: 0;
}
}

.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: #c0392b;
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.2em;
border-bottom: 1px solid #ecf0f1;
}

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: #92f4bb;
border-color: #92f4bb;
}

table.games-stat td.draw {
background: #f5d76e;
border-color: #f5d76e;
}

table.games-stat td.loss {
background: #f9594a;
border-color: #f9594a;
}




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

table.next-games td {
line-height: 2.2em;
border-bottom: 1px solid #ecf0f1;
}

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: #92f4bb;
}

table.games-ostat td.draw {
background: #f5d76e;
}

table.games-ostat td.loss {
background: #f9594a;
}

table.games-ostat td.ou {
background: #ecf0f1;
border-left: 1px solid #c8d6e5;
}

table.games-ostat td.ou1 {
border-left: 1px solid #ecf0f1;
}



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

table.odds:first-of-type {
margin-top: 3.2em;
}

table.odds th {
line-height: 2.2em;
color: #ffffff;
background: #2980b9;
white-space: nowrap;
}

table.odds th:first-of-type {
border-radius: 2px 0 0 0;
}

table.odds th:last-of-type {
border-radius: 0 2px 0 0;
}

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

table.odds td {
line-height: 2.2em;
border-bottom: 1px solid #ecf0f1;
}

table.odds td.bookmaker {
padding-left: 2px;
}

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

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

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

p.odds-info {
padding: 0 0.2em;
margin: 0.6em 0 0 0;
line-height: 1.4em;
font-size: 84%;
}


@media screen and (max-width: 420px) {
table.odds th:first-of-type, table.odds th:last-of-type {
border-radius: 0;
}
table.odds td.bookmaker {
padding-left: 12px;
}
}


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.2em;
}

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

table.perf td.title {
text-align: center;
background: #ecf0f1;
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 #ecf0f1;
}

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.2em;
}

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

table.perft td.title {
text-align: center;
background: #ecf0f1;
padding-left: 0.12em;
padding-right: 0.12em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

table.perft td.space {
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.2em;
color: #ffffff;
background: #2980b9;
text-align: left;
padding-left: 0.8em;
white-space: nowrap;
overflow: hidden;
}

table.lperf td {
line-height: 2.2em;
border-bottom: 1px solid #ecf0f1;
}

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: #ecf0f1;
}


@media screen and (max-width: 420px) {
.game-content {
margin-left: 0;
margin-right: 0;
}
table.odds td.bookmaker {
padding-left: 0.8em;
}
}





/*
* 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.2em;
text-align: center;
font-weight: bold;
background: #ecf0f1;
vertical-align: top;
}

table.lgames td {
line-height: 2.2em;
padding-left: 0.62em;
padding-right: 0;
border-bottom: 1px solid #ecf0f1;
}

table.lgames td.selected, table.lgames tr.team {
background: #f5d76e;
}

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: #92f4bb;
}

table.lgames td.draw {
background: #f5d76e;
}

table.lgames td.loss {
background: #f9594a;
}

table.lgames tr.group td {
height: 0;
line-height: 0;
padding: 0;
border-top: 2px solid #c0392b;
border-bottom: 2px solid #c0392b;
}


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

table.chrono td {
line-height: 2.2em;
border-bottom: 1px solid #ecf0f1;
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.5em;
line-height: 1.5em;
padding-top: 0.7em;
}

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

table.chrono td.games span.win {
background: #27ae60;
}

table.chrono td.games span.draw {
background: #f39c12;
}

table.chrono td.games span.loss {
background: #e74c3c;
}

table.chrono td.games span.empty {
background: #dcdcdc;
}


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

table.standing th {
line-height: 2.2em;
text-align: center;
font-weight: bold;
background: #ecf0f1;
}

table.standing tr.team {
background: #f5d76e;
}

table.standing td {
line-height: 2.2em;
padding-left: 0.62em;
padding-right: 0;
border-bottom: 1px solid #ecf0f1;
}

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 #c0392b;
border-bottom: 2px solid #c0392b;
}


@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: #2ecc71;
}

.stp6, .stp12, .stp15, .stp18 {
background: #92f4bb;
}

.stp9, .stp14, .stp19, .stp22 {
background: #58aee8;
}

.stp24, .stp31 {
background: #79c7fc;
}

.stp1, .stp32 {
background: #f9594a;
}

.stp2, .stp5, .stp23 {
background: #f9a931;
}

.stp4, .stp8, .stp10, .stp16, .stp21 {
background: #8fcdf7;
}

.stp3 {
background: #58aee8;
}

.stp25 {
background: #48d1cc;
}

.stp26, .stp28 {
background: #5efff6;
}

.stp27, .stp29 {
background: #9fe0dc;
}

.stp-none {
}


span.form-win {
background: #008010;
}

span.form-draw {
background: #f39c12;
}

span.form-loss {
background: #d64541;
}

span.empty {
background: #ffffff;
}

.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: #2455c3;
}

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

.team-link a:visited {
color: #2455c3;
}



.live-stream, .live-betting {
margin: 1em auto 1em auto;
line-height: 1.42em;
text-align: center;
font-size: 1.1em;
}

.live-stream span, .live-betting span {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.live-stream a, .live-betting a {
color: #2455c3;
text-decoration: none;
}

.live-stream a:visited, .live-betting a:visited {
color: #2455c3;
}

.live-stream a:hover, .live-betting a:hover {
text-decoration: underline;
}




.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;
}




#game-1-ad {
margin: 32px auto -32px auto;
text-align: center;
}

#game-2-ad {
margin: -12px auto -18px auto;
text-align: center;
}

#game-3-ad {
margin: 32px auto -18px auto;
text-align: center;
}

#game-4-ad {
margin: 32px auto -18px auto;
text-align: center;
}

.games-inside {
margin: 52px auto -18px auto;
text-align: center;
}
