:root {
	--bg-color: #fff;
	--bg-color-2nd: #f8f9fa;
	--bg-color-3rd: #dee2e6;
	--text-color: #212529;
	--text-color-2nd: rgba(0,0,0,.5);
	--text-color-highlight: #28a745;
}
@media (prefers-color-scheme: dark) {
	:root {
		--bg-color: #212529;
		--bg-color-2nd: #2c3237;
		--bg-color-3rd: #383f45;
		--text-color: #fff;
		--text-color-2nd: rgba(255,255,255,.5);
		--text-color-highlight: #28a745;
	}
}
[data-theme="light"] {
	--bg-color: #fff;
	--bg-color-2nd: #f8f9fa;
	--bg-color-3rd: #dee2e6;
	--text-color: #212529;
	--text-color-2nd: rgba(0,0,0,.5);
	--text-color-highlight: #28a745;
}
[data-theme="dark"] {
	--bg-color: #212529;
	--bg-color-2nd: #2c3237;
	--bg-color-3rd: #383f45;
	--text-color: #fff;
	--text-color-2nd: rgba(255,255,255,.5);
	--text-color-highlight: #28a745;
}
html,
body {
	height: 100%;
}
.text-standard {
	color: var(--text-color);
}
a:hover {
	text-decoration: none;
}
a.clean:link, a.clean:hover, a.clean:visited {
	color: var(--text-color);
}
h1 {
	font-size: 1.75rem;
}
h2 {
	font-size: 1.5rem;
}
h3, h4 {
	font-size: 1.25rem;
}

select {
	/*appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;*/
}
.custom-select {
	color: var(--text-color);
	background-color: var(--bg-color-2nd);
	border-color: var(--bg-color-3rd);
}
input, input.form-control {
	color: var(--text-color);
	background-color: var(--bg-color);
	border-color: var(--bg-color-3rd);
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	margin: 0; 
}
input[type=number] {
	-moz-appearance: textfield;
}

.brand-text-shaddow {
	text-shadow: 1px 1px 1px #888;
}
.brand-text-k {
	color: #004d00;
	font-weight: bold;
}
.brand-text-e {
	color: #008000;
	font-weight: bold;
}

.navbar-toggler-icon-fa {
	display: inline-block;
  	font-size: 1.5rem;
	color: rgba(0,0,0,.5);
}
.dropdown-menu {
	color: var(--text-color);
	background-color: var(--bg-color-2nd);
	border-color: var(--bg-color-3rd);
}
.dropdown-item {
	color: var(--text-color);
}
.dropdown-item:hover {
	background-color: var(--bg-color-3rd);
}
.dropdown-divider {
	border-color: var(--bg-color-3rd);
}
.logout-form {
	padding: 0.5rem 0;
}
.logout-form .btn {
	padding: 0;
	color: rgba(0,0,0,.5);
}
.logout-form .btn:hover {
	color: rgba(0,0,0,.7);
	text-decoration: none;
}
.breadcrumb {
	background-color: var(--bg-color-2nd);
}
.breadcrumb-item.active {
	color: var(--text-color-2nd);
}

.btn-light {
	color: var(--text-color);
	background-color: var(--bg-color-2nd);
	border-color: var(--bg-color-3rd);
}
.btn-outline-primary {
	background-color: var(--bg-color-2nd);
	border-color: var(--bg-color-3rd);
}

.wrap {
	min-height: 100%;
	height: auto;
	margin: 0 auto -60px;
	padding: 0 0 60px;
}
.wrap > .container {
	/*padding: 70px 15px 20px;*/
}

.footer {
	height: 60px;
	background-color: #f5f5f5;
	border-top: 1px solid #ddd;
	padding-top: 20px;
	color: rgba(0,0,0,.5);
}
.theme-button {
	cursor: pointer;
}

.jumbotron {
	text-align: center;
	background-color: transparent;
}
.jumbotron .btn {
	font-size: 21px;
	padding: 14px 24px;
}

.pagination {
	justify-content: center;
}

.not-set {
	color: #c55;
	font-style: italic;
}

.btn-app {
	border-color: var(--bg-color-3rd);
	font-size: 0.875rem;
	height: 60px;
	margin: 0 0 10px 10px;
	min-width: 80px;
	padding: 15px 5px;
}
.btn-app > .fas, .btn-app > .far {
	display: block;
	font-size: 1rem;
}


/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
	position: relative;
	top: 1px;
	display: inline-block;
	font-family: "Font Awesome 5 Free";
	font-style: normal;
	line-height: 1;
	padding-left: 5px;
}
a.asc:after {
	content: "\f15d";
}
a.desc:after {
	content: "\f15e";
}
.sort-numerical a.asc:after {
	content: "\f162";
}
.sort-numerical a.desc:after {
	content: "\f163";
}
.sort-ordinal a.asc:after {
	content: "\f160";
}
.sort-ordinal a.desc:after {
	content: "\f161";
}

.grid-view th {
	white-space: nowrap;
}

.table thead th {
	border-bottom: 1px solid #dee2e6;
}
.table th.head-link {
	padding: 0 0 0.45rem 0;
}
.table th.head-link a {
	padding: 0.45rem 0.45rem 0 0.45rem;
}

.table td i.hide-prediction {
	color: rgba(0, 0, 0, 0.2);
}

.hint-block {
	display: block;
	margin-top: 5px;
	color: #999;
}

.error-summary {
	color: #a94442;
	background: #fdf7f7;
	border-left: 3px solid #eed3d7;
	padding: 10px 20px;
	margin: 0 0 15px 0;
}

@media(max-width: 364px) {
  .navbar-brand {
	/*font-size: 1rem;*/
  }
}

table.table-club-logo tr td {
	vertical-align: middle;
}

td.formatNumber, th.formatNumber, input.formatNumber {
	text-align: right;
}

.table-striped tbody tr.user-highlight {
	background-color: #e5f2e5;
}

@media(orientation:portrait) {
	.hide-on-portrait {
		display: none;
	}
}

td.summary-daywin {
	font-weight: bold;
	color: var(--text-color-highlight);
}

div.fixture-table {
	width: 100%;
	margin-bottom: 1rem;
}
div.fixture-row {
	width: 100%;
	border-top: 1px solid var(--bg-color-3rd);
}
div.fixture-row:nth-of-type(2n+1) {
	background-color: var(--bg-color-2nd);
}
div.fixture-data {
	width: 100%;
	display: flex;
}
div.fixture-data-winner-head > div {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
div.fixture-data-bonus > div {
	width: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}
div.fixture-row > div > div {
	padding: 0.45rem;
}
div.fixture-home {
	width: 49%;
	display: flex;
	align-items: center;
	flex-direction: row-reverse;
	text-align: right;
}
div.fixture-home > div > img {
	margin: 0 1em 0 .5em;
}
div.fixture-guest {
	width: 49%;
	display: flex;
	align-items: center;
	flex-direction: row;
}
div.fixture-guest > div > img {
	margin: 0 .5em 0 1em;
}
div.fixture-result-input {
	width: 40px;
}
div.fixture-result {
	width: 2%;
	display: flex;
	align-items: center;
	justify-content: center;
}
div.fixture-helper {
	width: 100%;
	display: flex;
}
div.fixture-helper > div.fixture-helper-home {
	width: 49%;
	text-align: right;

}
div.fixture-helper > div.fixture-helper-guest {
	width: 49%;
}
div.fixture-startAt {
	width: 100%;
	text-align: center;
	font-weight: bold;
	padding: .5em;
	background-color: var(--bg-color-3rd);
}
div.fixture-day {
	width: 100%;
	text-align: center;
	font-size: 0.75em;
	padding-top: .2em;
}
div.fixture-errors > div > ul {
	margin-bottom: 0;
}
@media(orientation:portrait) {
	div.fixture-home, div.fixture-guest {
		flex-direction: column;
		text-align: center;
	}
	div.fixture-home > div > img, div.fixture-guest > div > img { 
		margin: 0 auto;
	}
	div.fixture-result-input {
		order: 99;
	}
	div.fixture-result-input > input {
		text-align: center;
	}
	div.fixture-helper > div, div.fixture-helper > div.fixture-helper-home {
		text-align: center;
	}
}

sub.predictions-points {
	color: var(--text-color-highlight);
	margin-left: .2em;
	bottom: -0.4em;
}
span.predictions-winner {
	text-decoration: underline;
}

.navbar-content {
	margin-bottom: 1em;
}

.day-select {
	display: flex;
}
.day-select > div > .day-select-prev > a {
	padding: 2px 11px 0 9px;
}
.day-select > div > .day-select-next > a {
	padding: 2px 9px 0 11px;
}

.actions {
  margin-bottom: 20px;
}

.star {
  font-size: 70%;
  margin-top: 5px;
  vertical-align: top;
}
.star-bl {
/*  color: #28a745;*/
  color: #000;
}
.star-em {
/*  color: #ffc332;*/
  color: #dd0000;
}
.star-wm {
/*  color: #ffd700;*/
  color: #ffce00;
}
.star-club-wm {
  color: #f7b5cd;
}
td.col-stars {
	padding-left: 0;
	padding-right: 0;
}
tr.user-highlight i.star {
	/*margin-top: 4px;*/
}

.news-date {
	font-style: italic;
	color: var(--text-color-2nd);
}

.club-logo {
}
.club-logo-bordered {
	border: 1px solid #dee2e6;
}

[data-theme="dark"] {
	body {
		background-color: var(--bg-color);
	    color: var(--text-color);
	}
	a.clean:link, a.clean:hover, a.clean:visited {
	    color: var(--text-color);
	}

	.brand-text-shaddow {
		text-shadow: 1px 1px 1px #070708;
	}
	.brand-text-k {
		color: #006100;
	}
	.brand-text-e {
		color: #24973e;
	}

	.navbar-light .navbar-nav .nav-link {
		color: rgba(255,255,255,.5);
	}
	.navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active {
		color: rgba(255,255,255,.9);
	}
	.navbar-light .navbar-toggler {
		color: rgba(255,255,255,.5);
		border-color: rgba(255,255,255,.1);
	}
	.navbar-toggler-icon-fa {
		color: rgba(255,255,255,.5);
	}
	.logout-form .btn {
		color: rgba(255,255,255,.5);
	}
	.logout-form .btn:hover {
		color: rgba(255,255,255,.7);
	}
	.dropdown-item:hover {
		color: var(--text-color);
		background-color: var(--bg-color-3rd);
	}
	.btn-light:hover {
		color: var(--text-color);
		background-color: var(--bg-color-3rd);
		border-color: var(--bg-color-2nd);
	}
	.btn-info {
		color: var(--text-color);
		background-color: #117a8b;
		border-color: #117a8b;
	}
	.custom-control-label::before {
	    background-color: var(--bg-color-2nd);
	}
	.page-item.disabled .page-link, .page-link {
		background-color: var(--bg-color-2nd);
	    border-color: var(--bg-color-3rd);
	}

	table th, .table td {
		border-top: 1px solid var(--bg-color-3rd);
	}
	.table thead th {
		border-bottom: 1px solid var(--bg-color-3rd);
	}
	.table-striped tbody tr:nth-of-type(2n+1) {
		background-color: var(--bg-color-2nd);
	}
	.table-striped tbody tr.user-highlight {
	    background-color: #223322;
	}
	.footer {
	    background-color: var(--bg-color-2nd);
	    border-top: 1px solid var(--bg-color-3rd);
	}
	.theme-button-light {
		color: var(--text-color);
	}
}
