@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap");

#wrapper {
	background: none;
	background-image: linear-gradient(to bottom, #ffffff, #d9d9d9);
}

#main {
	background-image: url("../images/2021/bg.jpg");
	background-repeat: no-repeat;
}

#lang a {
	font-weight: 700;
	font-size: 20px;
	line-height: 22px;
	letter-spacing: -1px;
	color: #212121 !important;
}

#lang a.active {
	color: #e2007a !important;
}

.time-counter-wrap {
	background: rgba(223, 222, 223, 0.85);
	font-family: "Dosis";
	font-weight: 700;
}

.flip-clock-wrapper ul li a div div.inn,
.flip-clock-wrapper ul {
	background: #b9b9b9;
}

.flip-clock-wrapper ul li a div div.inn,
.flip-clock-divider .flip-clock-label {
	font-family: "Dosis";
	color: #212121;
}

.flip-clock-divider .flip-clock-label {
	font-weight: 600;
}

.time-counter-wrap {
	width: 345px;
}

.flip-clock-wrapper ul li a div div.inn {
	font-size: 29px;
	line-height: 47px;
	letter-spacing: -1.02px;
	font-weight: 400;
}

.flip-clock-divider {
	height: 80px;
}

.flip-clock-divider .flip-clock-label {
	width: 100px;
	top: 60px;
	right: inherit;
}

.flip-clock-divider.days .flip-clock-label {
	left: -15px;
}

.flip-clock-divider.hours .flip-clock-label {
	left: 3px;
}

.flip-clock-divider.minutes .flip-clock-label {
	left: 3px;
}

.flip-clock-divider.seconds .flip-clock-label {
	left: 3px;
}

.flip-clock-wrapper ul {
	font-size: 29px;
	line-height: 47px;
	letter-spacing: -1.02px;
	height: 47px;
	width: 29px;
}

.time-counter-wrap h3 {
	text-align: center;
	padding-left: 0;
	color: rgb(33, 33, 33);
	font-size: 17px;
	line-height: 19px;
	letter-spacing: -0.49px;
}

#baner .banners {
	position: relative;
	background: url("../images/2021/step-bg.png") no-repeat;
	background-size: 100% 100%;
	margin-top: 130px;
	width: 940px;
}

#baner .banner {
	height: 302px;
	width: 33.33%;
}

#baner .banner-number {
	background: #004288 !important;
}


#baner .banner-text .banner-color,
#baner .banner-text .banner-color a {
	color: #004288 !important;
	font-weight: 600;
}

header {
	width: 1166px;
	margin-left: auto;
	margin-right: auto;
}

footer.new-footer {
	margin-top: 26px;
	font-family: "Dosis";
	font-weight: 700;
	padding: 0;
	background-color: #000;
}

.home-register-buttons {
	background: rgba(224, 224, 224, 0.74);
	width: 276px;
	border-radius: 31px;
	padding: 10px 24px !important;
	margin-top: 63px;
	margin-bottom: 72px;
	margin-left: auto;
	margin-right: auto;
}

#button_big_register {
	float: inherit !important;
	width: 100% !important;
	font-size: 24px !important;
	line-height: 24px !important;

	padding: 13px 0 !important;
	margin: 10px 0 !important;
	/* background: rgb(218, 0, 27) !important; */
	background: url("../images/2022/rejestracja.png") !important;
	background-size: 100% 100% !important;
	border-radius: 90px !important;
	text-align: center;
	font-family: "Dosis" !important;
	font-weight: 300 !important;
	text-transform: inherit !important;
	letter-spacing: 0px !important;
}

#button_big_login {
	float: inherit !important;
	width: 50% !important;
	font-size: 16px !important;
	line-height: 16px !important;

	padding: 13px 0 !important;
	margin: 10px 0 !important;
	margin-left: 25% !important;
	color: var(--color-btn) !important;
	background: #fff !important;
	border-radius: 90px !important;
	text-align: center;
	font-family: "Dosis" !important;
	font-weight: 300 !important;
	text-transform: inherit !important;
}

@media (min-width: 0px) and (max-width: 767px) {
	#lang a {
		font-size: 15px;
		line-height: 17px;
		letter-spacing: -0.75px;
	}

	header {
		width: 100%;
		text-align: center;
	}

	#lang {
		text-align: right;
	}

	#main {
		width: 100%;
		padding: 0;
		background-size: auto 877px;
		background-position: top center;
		background-image: url("../images/2021/bg-758.jpg");
		background-repeat: no-repeat;
	}

	header section {
		margin-top: 85px;
	}

	#baner {
		min-width: 325px;
		width: 70%;
		margin-left: auto;
		margin-right: auto;
	}

	#baner .banners {
		background: none;
		margin-top: 25px;
		width: 100%;
		margin-left: 0;
	}

	#baner .banner {
		height: 220px;
		width: 100%;
		-webkit-backdrop-filter: blur(30px);
		backdrop-filter: blur(30px);
		background-image: linear-gradient(143deg, #ffffff 13%, #e8e8e8 87%);
		margin-bottom: 17px;
	}

	footer.new-footer {
		margin-top: 23px;
		padding: 0;
	}

	.time-counter-wrap {
		right: calc(50% - 152px);
		width: 304px;
	}

	#lang {
		right: 16px;
	}


	.flip-clock-divider.days .flip-clock-label {
		left: -15px;
	}

	.flip-clock-divider.hours .flip-clock-label {
		left: -11px;
	}

	.flip-clock-divider.minutes .flip-clock-label {
		left: -11px;
	}

	.flip-clock-divider.seconds .flip-clock-label {
		left: -14px;
	}
}

@media (min-width: 768px) {
	#lang a {
		font-size: 15px;
		line-height: 17px;
		letter-spacing: -0.75px;
	}

	header {
		width: 100%;
	}

	#main {
		width: 100%;
		padding: 0;
		background-size: auto 677px;
		background-position: top center;
		background-image: url("../images/2021/bg-758.jpg");
		background-repeat: no-repeat;
	}

	header section {
		margin-top: 85px;
	}

	#baner {
		width: 732.8px;
		margin-left: auto;
		margin-right: auto;
	}

	#baner .banners {
		background-size: 100% 100%;
		margin-top: 72px;
	}

	#baner .banner {
		height: 240px;
		width: 33.33%;
	}

	footer.new-footer {
		margin-top: 23px;
		padding: 0;
	}

	.time-counter-wrap {
		right: 16px;
	}

	#lang {
		right: 16px;
	}

}

@media (min-width: 1024px) {
	#lang a {
		font-size: 20px;
		line-height: 22px;
		letter-spacing: -1px;
	}

	header {
		width: 100%;
	}

	#main {
		width: 100%;
		padding: 0;
		background-size: 100%;
		background-image: url("../images/2021/bg.jpg");
		background-repeat: no-repeat;
	}

	header section {
		margin-top: 85px;
	}

	#baner {
		width: 972.4px;
		margin-left: auto;
		margin-right: auto;
	}

	#baner .banners {
		background-size: 100% 100%;
		margin-top: 72px;
	}

	#baner .banner {
		height: 302px;
		width: 33.33%;
	}

	footer.new-footer {
		margin-top: 23px;
		padding: 0;
	}

	.time-counter-wrap {
		right: 25px;
	}

	#lang {
		right: 25px;
	}

}

@media (min-width: 1440px) {
	header {
		width: 1166px;
		margin-left: auto;
		margin-right: auto;
	}
	#main {
		width: 1200px;
		background-size: 100%;
		padding: 0 60px;
	}

	header section {
		margin-top: 85px;
	}

	#baner {
		width: inherit;
		margin-left: inherit;
		margin-right: inherit;
	}

	#baner .banners {
		background-size: 100% 100%;
		margin-top: 72px;
	}

	#baner .banner {
		height: 302px;
		width: 33.33%;
	}

	footer.new-footer {
		margin-top: 23px;
		padding: 0;
	}

	.time-counter-wrap {
		right: 115px;
	}

	#lang {
		right: 115px;
	}

}

@media (min-width: 1600px) {
	#main {
		width: 1200px;
		background-size: 100%;
	}

	header section {
		margin-top: 85px;
	}

	#baner .banners {
		background-size: 100% 100%;
		margin-top: 72px;
	}

	#baner .banner {
		height: 302px;
		width: 33.33%;
	}

	footer.new-footer {
		margin-top: 23px;
		padding: 0;
	}

	.time-counter-wrap {
		right: 88px;
	}

	#lang {
		right: 88px;
	}

}

@media (min-width: 1920px) {
	#main {
		width: 1440px;
		background-size: 100%;
	}

	header section {
		margin-top: 125px;
	}

	#baner .banners {
		background-size: 100% 100%;
		margin-top: 130px;
	}

	#baner .banner {
		height: 302px;
		width: 33.33%;
	}

	footer.new-footer {
		margin-top: 26px;
		padding: 0;
	}

	.time-counter-wrap {
		right: 0;
	}

	#lang {
		right: 0;
	}
}

#gameList {
	/*background: rgba(255, 255, 255, 0.72);*/
	background-image: linear-gradient(
		to bottom,
		rgba(255, 255, 255, 0.85),
		rgba(255, 255, 255, 0.89) 13%,
		#ffffff
	);
	padding-left: 20px;
	padding-right: 20px;
	max-width: 80%;
	margin-left: auto;
	margin-right: auto;
}

#gameList h2 {
	font-family: "Dosis";
	font-weight: 600;
	color: #212121;
	font-size: 34px;
	line-height: 38px;
}

#gameList .card-content p {
	font-family: "Dosis";
	font-weight: 400;
	color: #000;
	font-size: 18px;
	line-height: 22px;
}

#gameList .card-content p .blue {
	color: #e2007a !important;
}

#gameList .troe-finished {
	font-family: "Dosis";
	font-weight: 600;
	color: #6c6d70;
	font-size: 24px;
	line-height: 29px;
	padding-top: 30px;
}

#gameList p.username {
	line-height: 42px;
	color: #212121;
	margin: 10px 0;
}

#gameList .card-content p.username-b {
	display: flex;
	justify-content: center;
	font-size: 24px;
	color: #000;
	line-height: 29px;
	font-weight: normal;
}

#gameList .card-content p.username-b span{
	margin: 0 5px;
}

#gameList .card-content p.username-b img{
	margin-left: 8px;
	max-width: 30px;
	max-height: 30px;
}

#gameList .troe-img {
	margin: 0 auto;
}

#gameList .button,
#welcome .button {
	background: #004288 !important;
	border-radius: 90px !important;
	width: 135px;
	font-family: "Dosis" !important;
	font-weight: 400;
	color: #fff;
	padding: 10px 24px !important;
	text-transform: capitalize !important;
	transition: all .2s ease-in-out;
}

#gameList .card {
	background-image: linear-gradient(128deg, #ffffff 23%, #e6e6e6 98%);
}

#labels ul {
	border-bottom: 1px solid #e6e6e6;
}

#labels ul li a {
	background: none !important;
	font-family: "Dosis";
	font-weight: 600;
	text-transform: inherit;
	color: #212121 !important;
	font-size: 24px;
	line-height: 58px;
	letter-spacing: normal;
	height: 58px;
	border-radius: 10px;
}

#labels ul li a.active {
	color: #004288  !important;
}

#labels ul li a:hover {
	color: #004288  !important;
}

.logout.button {
	width: 159px;
	height: 39px;
	line-height: 39px;
	background: rgba(255, 255, 255, 0.8);
	border-radius: 20px;
	padding: 0;
	text-align: center;
	font-family: "Dosis";
	font-weight: 400;
	font-size: 19px;
	text-transform: inherit;
	color: #212121;
}

@media screen and (max-width: 767px) {
	#labels ul li {
		height: auto;
	}
}

#loginForm {
	background: rgba(255, 254, 254, 0.85);
	max-width: 420px;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
}
@media screen and (max-width: 420px) {
	#loginForm {
		max-width: 320px;
	}
}

#loginForm h2 {
	font-family: "Dosis" !important;
	font-weight: 700 !important;
	color: #212121 !important;
	font-size: 26px !important;
	line-height: 31.1px !important;
	letter-spacing: -0.91px;
}

#loginForm li.submit a {
	color: #212121 !important;
	font-family: "Dosis" !important;
	font-weight: 400 !important;
}

#loginForm ul li h2 {
	margin-bottom: 30px !important;
}

#loginForm .button {
	background: #004288 !important;
	border-radius: 90px !important;
	width: 135px !important;
	font-family: "Dosis" !important;
	font-weight: 400;
	font-size: 18px !important;
	line-height: 18.3px !important;
	letter-spacing: -0.56px !important;
	color: #fff;
	text-transform: capitalize !important;
	padding-top: 9px !important;
	padding-bottom: 9px !important;
}
#loginForm .button:hover,
#button_big_register:hover,
#button_big_login:hover,
.logout.button:hover,
#gameList .button:hover,
#welcome .button:hover {
	box-shadow: 0 0 20px 0 #004288;
}

#loginForm input[type="text"],
#loginForm input[type="email"],
#loginForm input[type="password"],
#loginForm input[type="number"] {
	border-radius: 0 !important;
	border: 1px solid #d8d8d8 !important;
	font-family: "Dosis";
	font-weight: 400 !important;
	font-size: 14px;
	line-height: 17.9px;
}

#loginForm li.submit a {
	font-family: "Dosis" !important;
	font-weight: 400 !important;
	color: #212121 !important;
	font-size: 14px !important;
	line-height: 14.4px !important;
}

#loginForm li.submit a:hover {
	font-weight: 700 !important;
	text-decoration: underline;
}

#gameList h2 {
	margin-top: 10px;
}

table.mainTab {
	font-family: "Dosis";
	color: #212121 !important;
	font-weight: 600 !important;
}

table.mainTab thead {
	font-family: "Dosis";
	font-weight: 600 !important;
	color: #212121 !important;
}

.mainTab tr th {
	border-color: #c3c3c3;
}

.mainTab > tbody > tr > td {
	font-family: "Dosis";
	border-color: #c3c3c3;
	font-size: 16px;
	line-height: 31px;
	letter-spacing: -0.4px;
	text-transform: uppercase;
}
.mainTab > tbody > tr > td.mobileInvisible {
	font-weight: 400 !important;
}

.button {
	text-align: center;
}

.pagination a.active {
	background: #212121 !important;
}



#gameList dt:after,
.img-more:after {
}

#gameList dd:before {
	color: #e2007a !important;
}

#gameList.registerList {
	max-width: 460px;
}

@media screen and (max-width: 420px) {
	#gameList.registerList {
		max-width: 320px;
	}
}

#regForm {
	padding: 20px;
}

#regForm ul li {
	width: 100%;
}

#regForm input[type="text"],
#regForm input[type="email"],
#regForm input[type="password"],
#regForm input[type="number"] {
	border-radius: 0 !important;
	border: 1px solid #d8d8d8 !important;
	font-family: "Dosis";
	font-weight: 400 !important;
	font-size: 14px;
	line-height: 17.9px;

	width: 100% !important;
}

#regForm input[type="text"]::placeholder,
#regForm input[type="email"]::placeholder,
#regForm input[type="password"]::placeholder,
#regForm input[type="number"]::placeholder {
	color: #212121;
}

.reg_info_icon {
	margin-top: 7px;
	margin-left: 7px;
	width: 24px;
	height: 24px;
	background: #fff;
	border-radius: 90px;
	color: #212121;
	text-align: center;
	line-height: 26px;
	font-family: "Dosis";
	font-weight: 600 !important;
	border: 1px solid #d8d8d8;
	position: relative;
}

.reg_info_icon:hover {
	background: #212121;
	color: #fff;
	border: 1px solid #212121;
	z-index: 999;
}

.reg_info {
	font-family: "Dosis";
	font-weight: 400 !important;
	border-radius: 0 !important;
	font-size: 14px;
	line-height: 16px;
	color: #212121;
	box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
	background-color: #ffffff !important;
}

#welcome {
	font-family: "Dosis";
	font-weight: 400 !important;
	font-size: 14px;
	line-height: 16px;
	color: #212121;
	box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
	background: rgba(255, 255, 255, 0.8) !important;
}

#welcome_text {
	color: #212121 !important;
	line-height: 26px !important;
}

#welcome_text a {
	color: #212121 !important;
	text-decoration: underline !important;
}

#regForm li label {
	font-family: "Dosis" !important;
	font-weight: 400 !important;
	color: #212121 !important;
	font-size: 12px !important;
	line-height: 16px !important;
	margin: 5px 0 !important;
}

#regForm li label a {
	color: #212121 !important;
	text-decoration: underline;
}

#regForm p.error {
	margin-left: 0 !important;
	margin-bottom: 0px;
	color: #004288 !important;
	font-family: "Dosis" !important;
	font-weight: 400 !important;
	font-size: 12px !important;
	line-height: 14.4px !important;
}

.button {
	height: auto !important;
	-webkit-appearance: none !important;
}

#loginForm ul li.error {
	color: #004288 !important;
	font-family: "Dosis" !important;
	font-weight: 400 !important;
	font-size: 12px !important;
	line-height: 14.4px !important;
}

.reg_info {
	right: 0;
	z-index: 99;
	bottom: 40px;
	height: auto;
}

@media screen and (max-width: 420px) {
	.reg_info {
		right: 0;
		z-index: 99;
		bottom: 40px;
		height: auto;
	}
}

.fa {
	color: #004288 !important;
}

.pagination a .fa {
	color: #000 !important;
}

#regForm ul li {
	position: relative !important;
}

#loginForm .error_info,
#loginForm .error_info a {
	color: #000 !important;
}

#loginForm .error_info a {
	text-decoration: underline;
}

#regForm ul li input.error,
#regForm ul li select.error {
	background-color: #fff !important;
	border: 1px solid #d8373c !important;
}

.final-prediction p {
	background: #004288;
	margin: 0;
	padding: 10px 20.5px 14px;
	font-size: 16px;
	line-height: 20px;
	color: #fff;
	font-family: "Dosis" !important;
	font-weight: 600 !important;
}

.final-prediction table {
	background-color: #e5e5e5;
}

.final-prediction select,
input {
	-webkit-appearance: none !important;
	border-radius: 0;
	padding: 5px 9px;
	border: solid 1px #535353;
	background-color: #ffffff;
	font-size: 12px;
}

select{
	color: #212121;
}

#gameList table td,
#gameList table th {
	padding: 12.5px 20.5px;
}

#gameList select[name="final[home]"] {
}

#gameList select[name="final[away]"] {
}

@media screen and (max-width: 768px) {
	.faq-dl dd {
		display: inherit !important;
	}

	#gameList .faq-dl dd:before {
		padding-top: 10px;
	}

	#gameList table td,
	#gameList table th {
		padding: 12.5px 10.5px;
	}

	#gameList table .allInvisible td,
	#gameList table .allInvisible th {
		padding: 12.5px 0;
	}

	#gameList select[name="final[home]"] {
		width: 100% !important;
	}

	#gameList select[name="final[away]"] {
		width: 100% !important;
	}

	.text-mobile-center {
		text-align: center !important;
	}
}

html,
body {
	max-width: 100%;
	overflow-x: hidden;
}

.scoring_rules {
	padding: 0 15px 30px;
}

.scoring_rules h4 {
	font-family: "Dosis";
	font-weight: 600;
	font-size: 20px;
	line-height: 31px;
	letter-spacing: -0.5px;
	color: #212121;
	text-transform: uppercase;
	margin-bottom: 0;
}

.scoring_rules p {
	font-family: "Dosis";
	font-weight: 400;
	font-size: 16px;
	line-height: 31px;
	letter-spacing: -0.4px;
	color: #212121;
	margin-bottom: 0;
}