@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&family=Roboto:ital,wght@0,100..900;1,100..900&family=Ultra&display=swap');

body { font-family: "Roboto", sans-serif; line-height:1.2; font-size:15px; color:#191919; }

a { text-decoration: none; cursor:pointer; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }

a:hover, a:focus, button:focus, button:hover { text-decoration: none; outline: none; }

img { max-width:100%;}

input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="password"], input[type="number"], textarea, select {
    color: #666;
    width: 100%;
}
button {
	background: none;
	border: none;
	padding: 0;
}
button:hover {
	transform: scale(0.98);
	filter: brightness(1.07);
}
.t-body {
	overflow: hidden;
}
.deco {
	position: absolute;
}
.max-container {
	position: relative;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 10px;
}
#confetti {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
}
.music-wrapper {
    position: fixed;
    z-index: 99;
    right: 0;
    bottom: 50px;
    opacity: 1;
    transition: 0.3s;
    overflow: hidden;
    height: 40px;
    width: 40px;
    background: #fff;
    border-radius: 10px 0 0 10px;
}
.music-wrapper audio {
    position: absolute;
    left: -6px;
    top: -7px;
}
audio:focus {
	outline: none;
}
button.home-btn {
    max-width: 60px;
    position: absolute;
    left: 5px;
    top: 5px;
    z-index: 9;
}
.floating-wrap {
	position: fixed;
	z-index: 999;
	right: 5px;
	top: 50px;
	background: url("../images/fifa-2026/floating-base.png")no-repeat;
	background-size: 100% 100%;
	padding: 4px;
}
button.float-btn {
    display: block;
    max-width: 60px;
}
button.float-btn:hover, button.home-btn:hover {
	transform: scale(0.97);
	filter: brightness(1.07);
}
.home-btn {
	position: absolute;
	left: 5px;
	top: 5px;
	z-index: 9;
}
body.main {
	background: url("../images/fifa-2026/bg-main.jpg")no-repeat top center;;
}
.top-sec {
	background: url("../images/fifa-2026/conft.png")no-repeat top center;
	background-size: 100%;
    position: relative;
    text-align: center;
    padding: 0 0 60px;
}
.logo {
	position: relative;
	z-index: 1;
	padding-top: 10px;
    max-width: 27%;
    margin: 0 auto -5%;
}
.title-top-main {
    position: relative;
    margin-bottom: -18%;
}
.deco.ball-1 {
    left: -4%;
    top: 31%;
    max-width: 13%;
	animation: float 2.1s ease-in-out infinite;
}
.deco.ball-2 {
    right: -4%;
    top: 50%;
    max-width: 13%;
	animation: float 2s ease-in-out infinite;
}
@keyframes float {
  0% {
	transform: translateY(0);
  }
  50% {
	transform: translateY(-12px);
  }
  100% {
	transform: translateY(0);
  }
}
.deco.glow-1 {
    mix-blend-mode: screen;
    max-width: 45%;
    left: 5%;
    top: 11%;
}
.deco.glow-2 {
    mix-blend-mode: screen;
    right: 9%;
    top: 2%;
    max-width: 40%;
}
.subtitle-wrap {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
}
.stext-1 {
    position: absolute;
    left: 0;
    right: 0;
    top: 15%;
    font-size: 23px;
    font-weight: 700;
    font-family: "Oswald";
    text-transform: uppercase;
}
.stext-2 {
    position: absolute;
    left: 0;
    right: 0;
    top: 39%;
    max-width: 80%;
    margin: 0 auto;
    color: #fff;
    font-size: 24px;
    font-weight: 500;
    height: 124px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.event-select-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
	grid-gap: 30px 0;
	padding: 30px 0;
}
.eventbox a {
    color: #000;
}
.eventbox {
	transition: ease 0.2s;
}
.eventbox:hover {
	transform: scale(1.03);
	filter: drop-shadow(0 0 5px #fff) brightness(1.07);
	transition: ease 0.2s;
}
.evdetail {
    font-size: 18px;
    max-width: 290px;
    margin: 0 auto;
}
.evdate {
    font-weight: 700;
    font-size: 120%;
}
.make-bet-title {
    background: linear-gradient(180deg, rgba(235, 228, 188, 1) 0%, rgba(192, 146, 90, 1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 40px;
    font-family: "Ultra";
    filter: drop-shadow(2px 2px 0px #745726) drop-shadow(0px -1px 0px #745726) drop-shadow(-1px 1px 0px #745726);
    text-transform: uppercase;
	margin-bottom: 15px;
}
.sports-provider {
    max-width: 1000px;
    margin: 0 auto;
}
.sport-logo {
    display: inline-block;
    vertical-align: bottom;
    width: 24%;
    margin: 5px 0;
}

button.close-x {
    position: absolute;
    z-index: 2;
    right: 5px;
    top: 5px;
    color: #000;
    font-size: 18px;
}
.modal-dialog.info {
    max-width: 750px;
}
.modal-content.popup {
    background: #fff7f1;
    border: 3px solid #dab697;
    border-radius: 12px;
    box-shadow: inset 0 0 6px rgb(0, 0, 0, 0.7);
    color: #000;
    padding: 15px;
    font-weight: 500;
    font-size: 15px;
}
.popup-title {
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
    text-transform: uppercase;
}
ul.terms {
    padding-left: 17px;
}
.language-wrapper {
    text-align: center;
}
.language-wrapper {
	text-align: center;
}
a.language-btn {
	display: inline-block;
	max-width: 90px;
	margin: 0 auto;
}
a.language-btn:hover {
	transform: scale(0.97);
	filter: brightness(1.07);
}

.title-top-1 {
    position: relative;
	margin: 0 auto 15px;
}
.subtitle-1 {
    position: absolute;
    left: 0;
    right: 0;
    top: 84%;
    font-size: 20px;
    font-weight: 600;
    max-width: 49%;
    margin: 0 auto;
}
.token-wrap {
    position: relative;
    max-width: 600px;
    margin: 0 auto;
}
.token-text {
    position: absolute;
    left: 0;
    right: 0;
    top: 29%;
    font-size: 64px;
    font-weight: 700;
    color: #fff;
    font-family: 'Oswald';
    text-shadow: 1px 2px 3px rgb(0, 0, 0, 0.6);
}
.daily-login-event {
    position: relative;
    max-width: 1000px;
    margin: 0 auto;
	padding: 30px 0 15px;
}
.daily-box {
	position: relative;
    display: inline-block;
    vertical-align: top;
    width: 23%;
    max-width: 224px;
    margin: 0 0.5% 45px;
}
.day-title {
    background: linear-gradient(180deg, rgba(235, 228, 188, 1) 0%, rgba(192, 146, 90, 1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 34px;
    font-family: "Ultra";
    filter: drop-shadow(2px 1px 0px #745726) drop-shadow(0px -1px 0px #745726) drop-shadow(-1px 1px 0px #745726);
    text-transform: uppercase;
}
.daily-base {
    position: relative;
}
.token-get {
    position: absolute;
    left: 0;
    right: 0;
    top: 27%;
    color: #fff;
    font-size: 58px;
    font-family: 'Oswald';
    font-weight: 700;
    text-shadow: 1px 2px 4px rgb(0, 0, 0, 0.7);
}
button.daily-claim-btn {
    background: url(../images/fifa-2026/claim-btn.png) no-repeat;
    background-size: 100% 100%;
    width: 100%;
    max-width: 220px;
    height: 60px;
    font-family: 'Oswald';
    font-weight: 700;
    text-transform: uppercase;
    font-size: 22px;
    text-shadow: 1px 2px 4px rgb(0, 0, 0, 0.5);
	filter: drop-shadow(0px 4px 2px rgb(0, 0, 0, 0.4));
    color: #fff;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -5%;
	pointer-events: none;
	filter: grayscale(0.8);
}
button.daily-claim-btn:hover {
	transform: scale(0.98);
	filter: brightness(1.07);
}
.daily-box.claimed button.daily-claim-btn {
	filter: none;
}
.daily-box.active button.daily-claim-btn {
	pointer-events: auto;
	filter: none;
	animation: blinkglow 1.5s ease-in-out infinite;
}
@keyframes blinkglow {
  0% {
	transform: scale(1);
  	filter: brightness(1);
  }
  50% {
	transform: scale(1.04);
	filter: brightness(1.07) drop-shadow(0 0 8px #ffe885);
  }
  100% {
	transform: scale(1);
	filter: brightness(1);
  }
}
.note-claim {
    font-size: 20px;
    font-weight: 700;
    max-width: 770px;
    margin: 0 auto 30px;
}
.other-events-wrap {
    position: relative;
    margin-bottom: 30px;
}
.other-event {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
.event-box {
	transition: ease 0.3s;
}
.event-box:hover {
	transform: scale(1.03);
	filter: brightness(1.07);
	transition: ease 0.3s;
}
table.comm-table {
	text-align: center;
}
table.comm-table tr th {
    padding: 10px 1px;
    background: #c6ad91;
}
table.comm-table tr td {
	background: #fff;
	border: 1px solid #c6ad91;
	padding: 10px 1px;
}
body.event1 {
	background: url("../images/fifa-2026/bg-1.jpg")no-repeat;
	background-size: cover;
}
.logo.v1 {
    margin: 0 auto -2%;
}
body.event2 {
	background: url("../images/fifa-2026/bg-1.jpg")no-repeat;
	background-size: cover;
}
.logo.v2 {
    margin: 0 auto -9%;
}
.title-top-2 {
    position: relative;
    margin-bottom: 15px;
}
.subtitle-2 {
    position: absolute;
    left: 0;
    right: 0;
    top: 89%;
    font-size: 22px;
    font-weight: 700;
    max-width: 460px;
    margin: 0 auto;
}
.mines-token {
    position: relative;
    z-index: 1;
    margin-bottom: -11%;
}
.note-play {
    color: #fff;
    font-size: 24px;
    font-weight: 600;
}
.mines-game-wrapper {
    position: relative;
    max-width: 991px;
    margin: 0 auto 30px;
}
.mgnote-1 {
    position: absolute;
    left: 35%;
    top: 18%;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
}
.mgnote-2 {
    position: absolute;
    left: 67%;
    top: 17%;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    max-width: 170px;
    text-align: left;
}
.reveal-text {
    position: absolute;
    left: 0;
    right: 0;
    top: 83%;
    color: #fff;
    font-size: 26px;
    font-weight: 500;
}
button.start-play-btn {
    position: absolute;
    left: 0;
    right: 0;
    top: 87%;
    background: url(../images/fifa-2026/start-btn.png) no-repeat;
    background-size: 100% 100%;
    width: 100%;
    max-width: 311px;
    height: 100px;
    margin: 0 auto;
    color: #fff;
    font-family: 'Oswald';
    font-size: 34px;
    font-weight: 600;
    text-transform: uppercase;
    text-shadow: 0px 0px 7px rgb(0, 0, 0, 0.8);
    padding-bottom: 0.5%;
}
button.start-play-btn:hover {
	transform: scale(0.98);
	filter: brightness(1.08);
}
.title-top-3 {
    position: relative;
    margin-bottom: 30px;
}
.subtitle-3 {
    font-size: 22px;
    font-weight: 700;
    max-width: 600px;
    margin: 0 auto;
}
.predict-token {
	margin-bottom: 30px;
}
.predict-token .note-play {
    color: #000;
}
.team-wrapper {
    position: relative;
	margin-bottom: 80px;
}
.ctry-wrap {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    position: absolute;
    left: 0;
    right: 0;
    top: 27%;
    max-width: 89%;
    margin: 0 auto;
}
.ctrybox {
    cursor: pointer;
    padding: 6%;
    border-radius: 13px;
    border: 2px solid transparent;
}
.ctrybox.active {
    background: #f8a83e;
    border-color: #fede60;
}
.ctrybox.active img {
    filter: drop-shadow(0 1px 3px rgb(0,0,0,0.5));
}
button.predict-submit-btn {
    background: url(../images/fifa-2026/pred-submit-btn.png) no-repeat;
    background-size: 100% 100%;
    width: 100%;
    max-width: 365px;
    height: 97px;
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    bottom: -7%;
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Oswald';
    color: #fff;
    text-shadow: 0px 1px 5px rgb(0, 0, 0, 0.8);
}
.reward-table-wrapper {
    max-width: 900px;
    margin: 15px auto 30px;
}
table.reward-table tr th {
    background: #c6ad91;
	color: #fff;
	border: 1px solid #000;
	padding: 10px 1px;
	text-transform: uppercase;
}
table.reward-table tr td {
	color: #000;
    background: #fff;
	border: 1px solid #000;
	padding: 10px 1px;
	font-weight: 600;
}
.title-top-4 {
    position: relative;
    margin-bottom: 35px;
}
.subtitle-4 {
    position: absolute;
    left: 0;
    right: 0;
    top: 90%;
    font-size: 22px;
    font-weight: 700;
    max-width: 600px;
    margin: 0 auto;
}
.pick-winner-title {
    background: linear-gradient(180deg, rgba(235, 228, 188, 1) 0%, rgba(192, 146, 90, 1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 34px;
    font-family: "Ultra";
    filter: drop-shadow(2px 2px 0px #745726) drop-shadow(0px -1px 0px #745726) drop-shadow(-1px 1px 0px #745726);
    text-transform: uppercase;
}
.team-vs-wrapper {
    position: relative;
    margin-bottom: 4%;
}
.match-date {
    position: absolute;
    left: 0;
    right: 0;
    top: 15%;
    font-family: 'Oswald';
    font-size: 30px;
    font-weight: 700;
}
.teamvs-wrap {
    position: absolute;
    left: 0;
    right: 0;
    top: 32%;
    display: grid;
    grid-template-columns: 43% 14% 43%;
    align-items: center;
    max-width: 90%;
    margin: 0 auto;
}
.teambox {
    position: relative;
    display: grid;
    grid-template-columns: 60% 40%;
    align-items: center;
    color: #fff;
	cursor: pointer;
}
.teambox.team2 {
    grid-template-columns: 40% 60%;
}
.cty-flag {
    position: relative;
    max-width: 270px;
    margin: 0 auto;
}
.vsflag {
    position: absolute;
	z-index: 1;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 82%;
    margin: 0 auto;
}
.slctbase {
	filter: grayscale(1);
}
.teambox.active .slctbase { 
	filter: grayscale(0) drop-shadow(0 0 4px #ffb400) drop-shadow(0 0 8px #ffb400);
}
.ctyname {
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
}
button.submit-match-btn {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -8%;
    background: url(../images/fifa-2026/pred-submit-btn.png) no-repeat;
    background-size: 100% 100%;
    width: 100%;
    max-width: 30%;
    height: 90px;
    margin: 0 auto;
    font-size: 28px;
    font-weight: 700;
    font-family: 'Oswald';
    text-transform: uppercase;
    text-shadow: 0px 1px 5px rgb(0, 0, 0, 0.7);
    color: #fff;
}
.predict-pts-wrap {
    position: relative;
    max-width: 500px;
    margin: 65px auto 0;
}
.pts-text {
    position: absolute;
    left: 0;
    right: 0;
    top: 43%;
    color: #fff;
    font-family: 'Oswald';
    font-weight: 600;
    font-size: 48px;
}
.pts-note {
    font-size: 24px;
    font-weight: 700;
    padding: 10px 0;
}

@media(max-width: 1080px) {
.floating-wrap {
	transform:scale(0.9);
	transform-origin: top right;
}	
.match-date {
    font-size: 2.8vw;
}	
button.submit-match-btn {
    max-width: 30%;
    height: 8vw;
    font-size: 2.6vw;
}
.ctyname {
    font-size: 1.7vw;
}
.predict-pts-wrap {
    margin: 7% auto 0;
}	
}

@media(max-width: 991px) {
.music-wrapper {
	transform: scale(0.85);
	transform-origin: right bottom;
}		
.floating-wrap {
	transform:scale(0.8);
}
button.home-btn {
    max-width: 50px;
}
.subtitle-1 {
    font-size: 18px;
}	
.day-title {
    font-size: 3.4vw;
}	
.make-bet-title {
    font-size: 3.5vw;
}	
.token-get {
    font-size: 5.8vw;
}
.daily-box {
    margin: 0 0.5% 5%;
}	
button.daily-claim-btn {
    font-size: 2.2vw;
    height: 5.8vw;
}
.subtitle-2 {
    font-size: 2vw;
    max-width: 42%;
}
.mgnote-1, .mgnote-2 {
    font-size: 2vw;
}
.reveal-text {
    font-size: 2.8vw;
}	
button.start-play-btn {
    max-width: 33%;
    font-size: 3.4vw;
    height: 10vw;
}
.subtitle-3 {
    font-size: 18px;
}
button.predict-submit-btn {
    max-width: 35%;
    font-size: 2vw;
    height: 9vw;
}
.team-wrapper {
    margin-bottom: 8%;
}
.subtitle-4 {
    font-size: 2.4vw;
    max-width: 60%;
}
.pick-winner-title {
    font-size: 4vw;
}	
}

@media(max-width: 767px) {
.music-wrapper {
	transform: scale(0.75);
}	
button.home-btn {
    max-width: 40px;
}	
.floating-wrap {
	transform:scale(0.7);
}
.evdetail {
    font-size: 2.2vw;
}	
.stext-1 {
    font-size: 2.8vw;
}
.stext-2 {
    font-size: 3vw;
    height: 16vw;
}
.note-claim {
    font-size: 16px;
}
.subtitle-1 {
	font-size: 2.5vw;
}	
.token-wrap {
    max-width: 81%;
}	
.token-text {
    font-size: 8vw;
}
.make-bet-title {
	font-size: 3.5vw;
}
.note-play {
    font-size: 3vw;
}	
.mines-token {
    margin-bottom: -14%;
}
table.reward-table {
    font-size: 14px;
}
.pts-note {
    font-size: 20px;
    padding: 5px 0;
}	
}

@media(max-width: 480px) {
.music-wrapper {
	transform: scale(0.65);
}		
button.home-btn {
    max-width: 35px;
}	
.floating-wrap {
	transform:scale(0.55);
}
.evdetail {
	font-size: 2.5vw;
}		
.popup-title {
    font-size: 18px;
}
.daily-box {
	margin: 0 0.5% 7%;
	width: 47%;
}
.day-title {
	font-size: 7vw;
}	
button.daily-claim-btn {
	font-size: 4.2vw;
	height: 11.8vw;
}
.token-get {
	font-size: 11.8vw;
}	
.note-claim {
	font-size: 15px;
}
.other-event {
    display: block;
}	
.event-box {
    display: inline-block;
    vertical-align: top;
    width: 49%;
}
.modal-content.popup {
    font-size: 14px;
}
.subtitle-3 {
	font-size: 15px;
}
table.reward-table {
    font-size: 13px;
}
.team-wrapper {
	background: #061020;
	border: 3px solid #f9cd6c;
	border-radius: 10px;
	padding: 15px 15px 50px;
	margin-bottom: 60px;
}	
.ctry-wrap {
    position: relative;
    max-width: 100%;
    grid-template-columns: repeat(6, 1fr);
}	
.board-img {
    display: none;
}	
button.predict-submit-btn {
    bottom: -28px;
    max-width: 220px;
    height: 55px;
    font-size: 13px;
}	
.predict-pts-wrap {
    max-width: 85%;
}	
.pts-text {
    font-size: 8vw;
}	
.pts-note {
    font-size: 15px;
}	
}



























































