html {
		scroll-behavior: smooth;
}

body {
		--wp--preset--font-family--heading: inherit;
		--wp--style--global--content-size: 720px;
}

.match-details-score input::-webkit-outer-spin-button,
.match-details-score input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.ranking.group-ranking-wide {
  border-radius: 10px;
  padding: 1rem;
  box-shadow: 0px 0 11px 0px #0000001c;
  border-width: 1px;
  border-color: #d6d6d6;
  width: 45%;
}

:where(body .is-layout-constrained) > :last-child:last-child {
		margin-block-end: 2em;
}

.page-id-8 .entry-content:has( > div.overview) {
	flex-direction: row;
}

.page-id-8 .entry-content {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}

.page-id-8.page-child .entry-content .ranking.group-ranking-wide:not(.overview) {
		width: 100%;
}

.group-ranking a {
  display: flex;
}

.group-ranking .flag {
  width: 30px;
  padding-right: 1em;
}

.group-ranking th.team {
  background-color: transparent !important;
  text-align: left;
}

.group-ranking tbody tr:nth-child(1), .group-ranking tbody tr:nth-child(2) {
	border-left: 3px solid green;
}

.group-ranking tbody tr:nth-child(3) {
		border-left: 3px solid orange;
}

.group-ranking th.plays {
  background-color: transparent !important;
}

.group-ranking th.wins {
  background-color: transparent !important;
}

table.ranking th {
  background-color: transparent;
  font-size: 0.7rem;
  font-style: normal;
  text-transform: uppercase;
  border-bottom-color: #a7a7a7;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}

.wins {
  background-color: transparent;
}

div.ranking h2 {
  font-family: inherit;
  font-weight: 600;
  text-align: center;
  font-size: 1rem;
  padding: 1rem;
}

table.ranking td {
  font-size: 80%;
  padding: 0.5em;
  text-align: center;
}

.group-ranking td.team {
  background-color: transparent;
}

table.ranking td.plays {
  background-color: transparent;
  border-bottom-width: 0px;
  font-weight: 400;
  font-size: 80%;
}

.group-ranking td.wins {
  background-color: transparent;
}

.group-ranking td.draws {
  background-color: transparent;
}

.group-ranking td.losses {
  background-color: transparent;
}

table.ranking td.points {
  background-color: transparent;
  font-weight: 400;
  font-size: 80%;
}

.group-ranking td.goals {
  background-color: transparent;
}

.group-ranking th.draws {
  background-color: transparent;
}

.group-ranking th.losses {
  background-color: transparent;
}

.group-ranking th.points {
  background-color: transparent;
}

.group-ranking th.goals {
  background-color: transparent;
}

.ranking.group-ranking tr:not(:last-child) {
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #a7a7a7;
}

.has-text-align-center.wp-block-post-title {
  font-weight: 600;
  font-family: unset;
}

.stadium-list div {
  display: flex;
	align-items: center;
	padding: 1em;
	border: 1px solid #d6d6d6;
	border-radius: 10px;
  box-shadow: 0px 0 11px 0px #0000001c;
}

.stadium-list div a {
		padding-right: 2em;
}

.stadium-list div img.stadium-photo.stadium-list {
	margin: 0;
}

.stadium-list div h2 {
  font-family: unset;
}

.stadium-photo {
		max-width: 100%;
		border-radius: 10px;
}

.matchinfo.new-layout .matchtype {
    color: #fff;
    background-color: #000;
    font-weight: 500;
    padding: 0.3em 1em;
    margin-bottom: 20px;
    border-radius: 10px;
}

.match-card {
  width: 45%;
  border-width: 1px;
  border-style: solid;
  border-color: #d6d6d6;
  border-radius: 10px;
  box-shadow: 0px 0 11px 0px #0000001c;
  padding: .5em !important; /*1.5*/
}

.matchinfo.new-layout .match-card-header {
  font-weight: 600;
  margin-bottom: 0em; /*2em*/
}

.matchinfo.new-layout .match-card-footer div.fp-icon {
		-webkit-box-flex: 0;
		flex: 0;
}

.matchinfo.new-layout .match-card-footer div .fp-joker-box {
		max-height: 25px;
		max-width: 25px;
		padding-top: 0;
		background-size: 25px;
}

.matchinfo.new-layout.statistics {
		min-width: 100%;
}

table.matchinfo.new-layout {
		padding: 1em;
    border: 1px solid #d6d6d6;
    border-radius: 10px;
    box-shadow: 0 0 11px 0 #0000001a;
}
		
table.statistics th {
		background-color: transparent;
		color: black;
		border-bottom: 1px solid #d6d6d6;
}

table.matchinfo.new-layout .home {
		text-align: right;
}

table.matchinfo.new-layout .score {
		text-align: center;
}

.matchinfo.new-layout .fp-joker, .matchinfo.new-layout .fp-nojoker {
		background-position: center;
		background-size: 25px;
}

.matchinfo.new-layout .match-card-footer .fp-icon a img {
		max-height: 25px;
}

.match-details {
		justify-content: space-between;
    display: flex;
    width: 100%;
}

.match-details-home {
  display: flex;
  flex-direction: column;
  justify-content: center;
	width: 30%;
}

.match-details-away {
  display: flex;
  flex-direction: column;
  justify-content: center;
	width: 30%;
}

.match-details-away .flag .flag,
.match-details-home .flag .flag {
  width: 75% !important;
}

.match-details-home .home, .match-details-away .away {
    padding: 0 0 1em 0 !important;
}

.matchinfo.new-layout .flag, 
.matchinfo.new-layout .home, 
.matchinfo.new-layout .away, 
.matchinfo.new-layout .score {
		width: 100% !important;
		font-size: 90% !important;
}

.matchinfo.new-layout .away img.flag, 
.matchinfo.new-layout .home img.flag{
		width: 50px !important; /*90px all under optional */
    border-radius: 5px;
    border: 1px solid lightgray;
    box-shadow: 0 0 11px 0 #dadada;
}

.match-details-score {
    display: flex;
    align-content: center;
    justify-content: center;
}

.match-details-score .score{
	font-size: 100% !important;
	padding: 0 5px 0px !important;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.match-details-score input.prediction {	
    padding: 2px 2px 2px 2px !important;
		font-size: 100% !important;
    height: 2em;
    width: 1.5em;
    border-radius: 5px;
    border-color: #d6d6d6;
}

.match-details-score .score .actual-score {
	padding-bottom: 1em;	
	font-weight: bold;
}

.match-navigation {
		display: flex;
		flex-wrap: wrap;
}

.match-navigation a {
		background: #f8f8f8;
    border: 1px solid #d6d6d6;
    border-radius: 10px;
    padding: 0.3em 1em;
    text-decoration: none;
    margin: 0 10px 10px 0;
    box-shadow: 0 0 3px 0 #0000005e;
}

/* Teams */
.football-pool.team-list {
		display: flex;
		flex-wrap: wrap;
		gap: 20px;
		list-style-type: none;
}

.football-pool.team-list a {
		font-size: xx-large;
    text-align: center;
    display: block;
    font-weight: bolder;
}

.football-pool.team-list li {
	border: 1px solid #d6d6d6;
  border-radius: 10px;
	padding: 1em;
	width: 100%;
  box-shadow: 0px 0 11px 0px #0000001c;
}

.football-pool.team-list .hide {
		display: none;
}

table.team.info tr th {
		white-space: nowrap;
		min-width: 110px;
}

table.team.info tr td p {
		margin: 0;
}

table.football-pool.team.info .stadium-list {
    padding-left: 1em;
}

img.team-photo.thumb {
		max-width: 100%;
		border-radius: 10px;
}

.cboxPhoto {
		border-radius: 10px;
}

/* Stadium */ 
.stadium-bio-info {
		width: 100%;
    text-align: left;
}

.matchinfo.new-layout div.flag:before {
		height: 0 !important;
}

/* Drawer */
.match-info-drawer {
		position: fixed;
    z-index: 10000;
    background: red;
    right: 0;
    top: 0;
    height: 100%;
    width: 80%;
    max-width: 300px;
    color: black;
    padding: 2em;
}

/* Modal */ 
.blocker {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	z-index: 1;
	padding: 20px;
	box-sizing: border-box;
	background-color: #000;
	background-color: rgba(0, 0, 0, 0.75);
	text-align: center
}

.blocker:before {
	content: "";
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-right: -0.05em
}

.blocker.behind {
	background-color: transparent
}

.modal {
	display: none;
    position: absolute;
    z-index: 2;
    right: 0;
    height: 100%;
    top: 0;
    padding: 2em;
    max-width: 300px;
    width: 90%;
    background: #fff;
    padding: 2em;
    box-shadow: 0 0 10px #000;
    text-align: left;
}

.modal a.close-modal {
		position: absolute;
		display: none;
}

table.statistics th.username {
    text-align: left;
}

.m-data {
	width: 100%;
  height: 200px;
  background: #ececec;
  border-radius: 10px;
  margin-bottom: 25px;
}

a.modal-close {
    background: orange;
    padding: 0.5em 1em;
    font-size: 115%;
    text-decoration: none;
    font-weight: bold;
    text-transform: lowercase;
    display: block;
    text-align: center;
    border-radius: 10px;
}