/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------- Page Format ----------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */
html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 120%;
    background: #000000;
    overflow-x: hidden;
    
    font-family: "Gill Sans", "Trebuchet MS", Arial, Helvetica, sans-serif;
    
    touch-action: none; /* Disables pinch-to-zoom */    
    -webkit-user-select: none;  /* Prevents text selection */    
    -webkit-touch-callout: none; /* Disables the callout menu on long press */
}

#MAIN_Canvas_Container{
	position: fixed;
	width: 1920px;
	height: 1080px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(1);
}

.Canvas{
	position: absolute;
	width: 1920px;
	height: 1080px;
	top: 0px;
	left: 0px;
}

input{
	border-radius: 0;
	padding: 1px;
}
input:focus{
	outline: none;
}
/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */


/* ----------------------------------------------------------------------------------------------- */
/* -------------------------------------- Intro Video Format ------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */
#NTRO_Canvas{
	display: none;
}
#MAIN_Canvas_Container[data-navi="1"] #NTRO_Canvas{
	display: block;
}

#NTRO_Video{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */


/* ----------------------------------------------------------------------------------------------- */
/* -------------------------------------- Scoreboard Format -------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */
#SBRD_Canvas{
	transition: transform 1s ease, opacity 1s ease;  
	transform-origin: center;
}
#MAIN_Canvas_Container[data-navi="1"] #SBRD_Canvas, #MAIN_Canvas_Container[data-navi="3"] #SBRD_Canvas, #MAIN_Canvas_Container[data-navi="4"] #SBRD_Canvas {
	animation: SBRD_Canvas_Zoom_In_Animation 1s linear forwards;
}
#MAIN_Canvas_Container[data-navi="2"] #SBRD_Canvas{
	animation: SBRD_Canvas_Zoom_Out_Animation 1s linear forwards;
}
@keyframes SBRD_Canvas_Zoom_In_Animation {
	0%{
		transform: scale(1);
		opacity: 1;
	}
	80%{
		transform: scale(2.5) translate(0px, 50px);
		opacity: 1;
	}
	100%{
		transform: scale(3) translate(0px, 70px);
		opacity: 0;
	}
}
@keyframes SBRD_Canvas_Zoom_Out_Animation {
	0%{
		transform: scale(3) translate(0px, 70px);
		opacity: 0;
	}
	20%{
		transform: scale(2.5) translate(0px, 50px);
		opacity: 1;
	}
	100%{
		transform: scale(1);
		opacity: 1;
	}
}

#SBRD_Logo_Background{
	position: absolute;
	width: 465px;
	height: 300px;
	top: 331px;
	left: 728px;
	
	background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
	
    font-size: 50px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
}

#SBRD_Logo{
	width: 380px;
	height: 205px;
	
	opacity: 1;
	transition: opacity 0.3s ease-in-out;
}
.SBRD_Logo_Fade{
	opacity: 0!important;
}

#SBRD_Logo_Front{
	position: absolute;
	width: 380px;
	height: 205px;
	
	background-image:url('resources/images/XXXX_Logo.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	
	opacity: 1;
	transition: opacity 1.0s ease-in-out;
}
#SBRD_Logo_Front.fade{
	opacity: 0!important;
	pointer-events: none!important;
}

#SBRD_Logo_Back{
	position: absolute;
	width: 380px;
	height: 205px;
	
	display:flex;
    justify-content: center;
    align-items: center;
    text-align: center;
	
	background-image:url('resources/images/XXXX_Logo_Back.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
}

#SBRD_GameCode{
	height: 50px;
	width: 200px;
	padding-left: 10px;
	
	font-size: 35px;
    color: #000000;
    font-family: "Arial";
    
    border: 1px solid black;
	background-color: #FFFFFF;
	
	margin: 0 5px;
}

#SBRD_SendCode{
	height: 52px;
	width: 52px;
	
	cursor: pointer;
	-ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;

	background-image:url('resources/images/SBRD_Lock.png');
	background-size:75% 75%;
	background-position:center;
	background-repeat:no-repeat;
    
    border: 1px solid black;
	background-color: #04AA6D;
}
#SBRD_SendCode:active {
	filter: brightness(80%);
	box-shadow: 0 0 1px 0 #000000 inset;
	margin-top: 2px;
}
#SBRD_SendCode.Disabled{
    background-color: #c0c0c0;
    color: #404040;
    cursor: not-allowed;
    pointer-events: none;
}

#SBRD_CodeError{
	position: absolute;
	top: 135px;
	left: 55px;
	width: 272px;
	height: 30px;
	
	font-size: 25px;
	color: #fc0d1b;
	font-weight: bold;
	
	display: none;
}

.SBRD_Points_TeamX{
	position: absolute;
	width: 209px;
	height: 122px;
    background: #f8bc05;
    font-size: 70px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#SBRD_Points_Team1{
	top: 419px;
	left: 415px;
}

#SBRD_Points_Team2{
	top: 419px;
	left: 1294px;
}

#SBRD_Points{
	position: absolute;
	width: 195px;
	height: 110px;
	top: 191px;
	left: 863px;
    
    background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
    
    font-size: 65px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#SBRD_Background{
	position: absolute;
	width: 100%;
    height: 100%;
	top: 0px;
	left: 0px;
	
	background-image:url('resources/images/SBRD_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	
	pointer-events: none;
}

#SBRD_Cover{
	position: absolute;
	width: 100%;
    height: 100%;
	top: 0px;
	left: 0px;
	
	background-image:url('resources/images/SBRD_Cover.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	
	pointer-events: none;
}

.SBRD_Name_TeamX{
	position: absolute;
	width: 410px;
	height: 80px;
	font-size: 50px;
	color: #FFFFFF;
	font-weight:bold;
	text-shadow: 2px 2px 6px #000000;
	
	display: flex;
	justify-content: center;
	align-items: center;
    text-align: center;
}

#SBRD_Name_Team1{
	top: 782px;
	left: 169px;
    -webkit-transform: rotate(-4.5deg);
	-moz-transform: rotate(-4.5deg);
	-o-transform: rotate(-4.5deg);
	-ms-transform: rotate(-4.5deg);
	transform: rotate(-4.5deg);
}

#SBRD_Name_Team2{
	top: 782px;
	left: 1333px;
    -webkit-transform: rotate(4.5deg);
	-moz-transform: rotate(4.5deg);
	-o-transform: rotate(4.5deg);
	-ms-transform: rotate(4.5deg);
	transform: rotate(4.5deg);
}

.SBRD_Name_TeamX_PlayerX{
	position: absolute;
	width: 350px;
	height: 60px;
	font-size: 38px;
	color: #FFFFFF;
	font-weight:bold;
	text-shadow: 2px 2px 6px #000000;
	
	display: none;
	justify-content: center;
	align-items: center;
    text-align: center;
    
	background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	border-radius: 10px;
	border-style: solid;
	border-color: #000000;
	border-width: 5px;
}

#SBRD_Name_Team1_Player1{
	top: 100px;
	left: 18px;
}

#SBRD_Name_Team1_Player2{
	top: 180px;
	left: 18px;
}

#SBRD_Name_Team1_Player3{
	top: 260px;
	left: 18px;
}

#SBRD_Name_Team1_Player4{
	top: 340px;
	left: 18px;
}

#SBRD_Name_Team1_Player5{
	top: 420px;
	left: 18px;
}

#SBRD_Name_Team1_Player6{
	top: 500px;
	left: 18px;
}

#SBRD_Name_Team1_Player7{
	top: 580px;
	left: 18px;
}

#SBRD_Name_Team1_Player8{
	top: 660px;
	left: 18px;
}

#SBRD_Name_Team2_Player1{
	top: 100px;
	left: 1552px;
}

#SBRD_Name_Team2_Player2{
	top: 180px;
	left: 1552px;
}

#SBRD_Name_Team2_Player3{
	top: 260px;
	left: 1552px;
}

#SBRD_Name_Team2_Player4{
	top: 340px;
	left: 1552px;
}

#SBRD_Name_Team2_Player5{
	top: 420px;
	left: 1552px;
}

#SBRD_Name_Team2_Player6{
	top: 500px;
	left: 1552px;
}

#SBRD_Name_Team2_Player7{
	top: 580px;
	left: 1552px;
}

#SBRD_Name_Team2_Player8{
	top: 660px;
	left: 1552px;
}
/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */


/* ----------------------------------------------------------------------------------------------- */
/* ------------------------------------ Question Round Format ------------------------------------ */
/* ----------------------------------------------------------------------------------------------- */
#QRND_Canvas{
	display: none;
}
#MAIN_Canvas_Container[data-navi="3"] #QRND_Canvas{
	display: block;
}

#QRND_Background{
	position: absolute;
	width: 100%;
    height: 100%;
	top: 0px;
	left: 0px;
	
	background-image:url('resources/images/QRND_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
}

#QRND_Points{
	position: absolute;
	width: 280px;
	height: 92px;
	top: 5px;
	left: 810px;
    background: #f8bc05;
    font-size: 65px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
	
	background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	border-radius: 35px;
	border-style: solid;
	border-color: #000000;
	border-width: 10px;
	outline: 10px solid #ed7d31;
	outline-offset: -20px;
}

.QRND_Name_TeamX{
	position: absolute;
	width: 450px;
	height: 85px;
	font-size: 50px;
	color: #FFFFFF;
	font-weight:bold;
	text-shadow: 2px 2px 6px #000000;
	
	display: flex;
	justify-content: center;
	align-items: center;
    text-align: center;
	
	background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	border-radius: 35px;
	border-style: solid;
	border-color: #000000;
	border-width: 10px;
	outline: 10px solid #ed7d31;
	outline-offset: -20px;
}

#QRND_Name_Team1{
	top: 10px;
	left: 10px;
}

#QRND_Name_Team2{
	top: 10px;
	left: 1440px;
}

.QRND_Points_TeamX{
	position: absolute;
	width: 235px;
	height: 85px;
	
    font-size: 60px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
	
	background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	border-radius: 35px;
	border-style: solid;
	border-color: #000000;
	border-width: 10px;
	outline: 10px solid #ed7d31;
	outline-offset: -20px;
}






.QRND_StrikeX_TeamX{
	position: absolute;
	top: 370px;
	left: 765px;
	width: 390px;
	height: 450px;

	background-image:url('resources/images/QRND_Wrong_X1.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	
	transform: scale(0);
	opacity: 0;
}

#QRND_Strike1_Team1.QRND_Strike_Active{
	animation: QRND_Strikes_Active_S1_T1 1.3s ease-out forwards;
}
#QRND_Strike2_Team1.QRND_Strike_Active{
	animation: QRND_Strikes_Active_S2_T1 1.3s ease-out forwards;
}
#QRND_Strike3_Team1.QRND_Strike_Active{
	animation: QRND_Strikes_Active_S3_T1 1.3s ease-out forwards;
}
#QRND_Strike1_Team2.QRND_Strike_Active{
	animation: QRND_Strikes_Active_S1_T2 1.3s ease-out forwards;
}
#QRND_Strike2_Team2.QRND_Strike_Active{
	animation: QRND_Strikes_Active_S2_T2 1.3s ease-out forwards;
}
#QRND_Strike3_Team2.QRND_Strike_Active{
	animation: QRND_Strikes_Active_S3_T2 1.3s ease-out forwards;
}

@keyframes QRND_Strikes_Active_S1_T1 {
	0% {
		transform: scale(0);
		opacity: 0;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	30% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	70% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	100% {
		transform: scale(1);
		opacity: 1;
		top: 17px;
		left: 515px;
		width: 85px;
		height: 90px;
	}
}
@keyframes QRND_Strikes_Active_S2_T1 {
	0% {
		transform: scale(0);
		opacity: 0;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	30% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	70% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	100% {
		transform: scale(1);
		opacity: 1;
		top: 17px;
		left: 600px;
		width: 85px;
		height: 90px;
	}
}
@keyframes QRND_Strikes_Active_S3_T1 {
	0% {
		transform: scale(0);
		opacity: 0;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	30% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	70% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	100% {
		transform: scale(1);
		opacity: 1;
		top: 17px;
		left: 685px;
		width: 85px;
		height: 90px;
	}
}

@keyframes QRND_Strikes_Active_S1_T2 {
	0% {
		transform: scale(0);
		opacity: 0;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	30% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	70% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	100% {
		transform: scale(1);
		opacity: 1;
		top: 17px;
		left: 1150px;
		width: 85px;
		height: 90px;
	}
}
@keyframes QRND_Strikes_Active_S2_T2 {
	0% {
		transform: scale(0);
		opacity: 0;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	30% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	70% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	100% {
		transform: scale(1);
		opacity: 1;
		top: 17px;
		left: 1235px;
		width: 85px;
		height: 90px;
	}
}
@keyframes QRND_Strikes_Active_S3_T2 {
	0% {
		transform: scale(0);
		opacity: 0;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	30% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	70% {
		transform: scale(1);
		opacity: 1;
		top: 370px;
		left: 765px;
		width: 390px;
		height: 450px;
	}
	100% {
		transform: scale(1);
		opacity: 1;
		top: 17px;
		left: 1320px;
		width: 85px;
		height: 90px;
	}
}

#QRND_Question_Container{
	position: absolute;
	top: 186px;
	left: 335px;
	width: 1230px;
	height: 130px;
	
	background-image: linear-gradient(#020407, #20365e);
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	
	border-style: solid;
	border-radius: 43px 43px 0px 0px;
	border-color: #FFFFFF;
	border-width: 10px;
	
	perspective: 2000px;
}

#QRND_Question{
	width: 100%;
	height: 100%;
	transform-style: preserve-3d;
}

#QRND_Question.flipped {
  animation: flipAnimation 1.0s ease-out forwards;
}

@keyframes flipAnimation {
  0% {
    transform: rotateX(0deg);
  }
  70% {
    transform: rotateX(-200deg);
  }
  100% {
    transform: rotateX(-180deg);
  }
}

#QRND_Question_Text{
	width: 100%;
	height: 100%;
	
	font-size: 40px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
	
	backface-visibility: hidden;
	background-image: linear-gradient(#4874c4, #0f3276);
	border-radius: 33px 33px 0px 0px;
    
    transform: rotateX(180deg);
}

#QRND_Question_Cover{
	position: absolute; 
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	
	backface-visibility: hidden;
	background-image: linear-gradient(#3da2fd, #133efb);
	border-radius: 33px 33px 0px 0px;
}

.QRND_Answer_ContainerX{
	position: absolute;
	width: 603px;
	height: 142px;
	
	background: #000000;
	
	border-style: solid;
	border-color: #FFFFFF;
	border-width: 10px;
	
	perspective: 2000px;
}
					
#QRND_Answer_Container1{
	top: 340px;
	left: 335px;
} 

#QRND_Answer_Container2{
	top: 507px;
	left: 335px;
} 

#QRND_Answer_Container3{
	top: 674px;
	left: 335px;
} 

#QRND_Answer_Container4{
	top: 841px;
	left: 335px;
	border-radius: 0px 0px 0px 43px;
} 

#QRND_Answer_Container5{
	top: 340px;
	left: 962px;
} 

#QRND_Answer_Container6{
	top: 507px;
	left: 962px;
} 

#QRND_Answer_Container7{
	top: 674px;
	left: 962px;
} 

#QRND_Answer_Container8{
	top: 841px;
	left: 962px;
	border-radius: 0px 0px 43px 0px;
} 

.QRND_Answer_TextX{
	float:left;
	width: 470px;
	height: 142px;
	
	font-size: 45px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.QRND_Answer_PointsX{
	float:left;
	width: 128px;
	height: 142px;
	
	background-color: #43a4fe;
	border-left: 5px solid #a1dbff;
	
	font-size: 70px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.QRND_AnswerX{
	width: 100%;
	height: 100%;
	transform-style: preserve-3d;
}

.QRND_AnswerX.flipped {
  animation: flipAnimation 1.0s ease-out forwards;
}

.QRND_Answer_RevealX{
	position: absolute; 
	backface-visibility: hidden;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transform: rotateX(180deg);
	background-image: linear-gradient(#4874c4, #0f3276);
}

.QRND_Answer_CoverX{
	position: absolute; 
	backface-visibility: hidden;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	
	background-image: linear-gradient(#3da2fd, #133efb);
	/*z-index: 1;*/
}

#QRND_Answer_Cover4, #QRND_Answer_Reveal4{
	border-radius: 0px 0px 0px 33px;
}

#QRND_Answer_Points8, #QRND_Answer_Cover8, #QRND_Answer_Reveal8{
	border-radius: 0px 0px 33px 0px;
}

.QRND_Answer_NumberX{
	position: absolute;
	top: 19px;
	left: 200px;
	width: 203px;
	height: 105px;
	
	background: radial-gradient(circle, #0820dc 10%, #042564 100%);
    border-radius: 50%;
	
	font-size: 70px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: hidden;
    justify-content: center;
    align-items: center;
    text-align: center;
	
	opacity: 0;
	transform: translateX(200px);
}

.QRND_Answer_NumberX_Fade{
	display: flex!important;
	animation: QRND_Answer_NumberX_Fade_Animation 0.1s linear forwards;
}
@keyframes QRND_Answer_NumberX_Fade_Animation{
	0%{
		opacity: 0;
		transform: translateX(200px);
	}
	100%{
		opacity: 1;
		transform: translateX(0px);
	}
}




#QRND_Strikes{
	position: absolute;
	top: 370px;
	left: 765px;
	width: 390px;
	height: 450px;

	background-image:url('resources/images/QRND_Wrong_X1.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	
	display: none;
}
#QRND_Strikes.QRND_Strikes_Active{
	display: block;
	animation: QRND_Strikes_Active 0.3s ease-out;
}
@keyframes QRND_Strikes_Active {
    from {
        transform: scale(0);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

#QRND_Timer{
	position: absolute;
	top: 154px;
	left: 304px;
	width: 1312px;
	height: 883px;
	
	font-size: 800px;
	color: rgba(255, 0, 0, 0.4);
	font-weight:bold;
	text-shadow: 5px 5px 100px #000000;
	
	display: none;
	justify-content: center;
	align-items: center;
    text-align: center;
}

#QRND_Logo_Background{
	position: absolute;
	top: 171px;
	left: 320px;
	width: 1280px;
	height: 848px;
	
	background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	border-radius: 60px;
	
	opacity: 1;
	transition: opacity 0.5s ease-in-out;
}

.QRND_Logo_Background_Fade{
	opacity: 0!important;
}

#QRND_Logo{
	position: absolute;
	width: 1022px;
	height: 548px;
	top: 95px;
	left: 129px;
	
	background-image:url('resources/images/XXXX_Logo.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
}

#QRND_Multiplier{
	position: absolute;
	top: 684px;
	left: 0px;
	width: 1280px;
	height: 150px;
	
	font-size: 130px;
	color: #FFFFFF;
	font-weight:bold;
	text-shadow: 5px 5px 100px #000000;
	
	display: flex;
	justify-content: center;
	align-items: center;
    text-align: center;
    
	animation: QRND_Multiplier_Animation 1.5s ease-out 1.0s forwards, QRND_Multiplier_Glow 0.5s infinite alternate;
	opacity: 0;
	transform: translateX(-90px);
}
@keyframes QRND_Multiplier_Animation{
	20% {
		opacity: 0;
	}
	60% {
		transform: translateX(20px);
	}
	75% {
		transform: translateX(-10px);
	}
	100% {
		opacity: 1;
		transform: translateX(0px);
	}
}

@keyframes QRND_Multiplier_Glow{
  from{text-shadow:0px 0px 5px #fff,0px 0px 5px #f7f700;}
  to{text-shadow:0px 0px 20px #fff,0px 0px 20px #f7f700;}
}

#QRND_Points_Team1{
	top: 120px;
	left: 10px;
}

#QRND_Points_Team2{
	top: 120px;
	left: 1655px;
}

.QRND_Name_TeamX_PlayerX{
	position: absolute;
	width: 239px;
	height: 60px;
	font-size: 26px;
	color: #FFFFFF;
	font-weight:bold;
	text-shadow: 2px 2px 6px #000000;
	
	display: flex;
	justify-content: center;
	align-items: center;
    text-align: center;
	
	background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	border-radius: 20px;
	border-style: solid;
	border-color: #000000;
	border-width: 8px;
	outline: 8px solid #ed7d31;
	outline-offset: -16px;
}

#QRND_Name_Team1_Player1{
	top: 340px;
	left: 10px;
}

#QRND_Name_Team1_Player2{
	top: 420px;
	left: 10px;
}

#QRND_Name_Team1_Player3{
	top: 500px;
	left: 10px;
}

#QRND_Name_Team1_Player4{
	top: 580px;
	left: 10px;
}

#QRND_Name_Team1_Player5{
	top: 660px;
	left: 10px;
}

#QRND_Name_Team1_Player6{
	top: 740px;
	left: 10px;
}

#QRND_Name_Team1_Player7{
	top: 820px;
	left: 10px;
}

#QRND_Name_Team1_Player8{
	top: 900px;
	left: 10px;
}

#QRND_Name_Team2_Player1{
	top: 340px;
	left: 1655px;
}

#QRND_Name_Team2_Player2{
	top: 420px;
	left: 1655px;
}

#QRND_Name_Team2_Player3{
	top: 500px;
	left: 1655px;
}

#QRND_Name_Team2_Player4{
	top: 580px;
	left: 1655px;
}

#QRND_Name_Team2_Player5{
	top: 660px;
	left: 1655px;
}

#QRND_Name_Team2_Player6{
	top: 740px;
	left: 1655px;
}

#QRND_Name_Team2_Player7{
	top: 820px;
	left: 1655px;
}

#QRND_Name_Team2_Player8{
	top: 900px;
	left: 1655px;
}
/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */


/* ----------------------------------------------------------------------------------------------- */
/* ------------------------------------ Question Round Format ------------------------------------ */
/* ----------------------------------------------------------------------------------------------- */
#BIGM_Canvas{
	display: none;
}
#MAIN_Canvas_Container[data-navi="4"] #BIGM_Canvas{
	display: block;
}

#BIGM_Background{
	position: absolute;
	width: 100%;
    height: 100%;
	top: 0px;
	left: 0px;
	
	background-image:url('resources/images/BIGM_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
}

.BIGM_Name_PlayerX{
	position: absolute;
	width: 480px;
	height: 150px;
    font-size: 50px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
	
	background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	border-radius: 35px;
	border-style: solid;
	border-color: #000000;
	border-width: 10px;
	outline: 10px solid #2f5597;
	outline-offset: -20px;
}

#BIGM_Name_Player1{
	top: 5px;
	left: 273px;
}

#BIGM_Name_Player2{
	top: 5px;
	left: 1147px;
}

#BIGM_Points{
	position: absolute;
	width: 280px;
	height: 150px;
	top: 5px;
	left: 810px;
    font-size: 110px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
	
	background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	border-radius: 35px;
	border-style: solid;
	border-color: #000000;
	border-width: 10px;
	outline: 10px solid #2f5597;
	outline-offset: -20px;
}

#BIGM_Answers_Container{
	position: absolute;
	top: 210px;
	left: 304px;
	width: 1312px;
	height: 783px;
	
	background-image:url('resources/images/BIGM_Board.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	border-radius: 60px;
}










.BIGM_PlayerX_AnswerX{
	position: absolute;
	width: 585px;
	height: 103px;
}

.BIGM_Player1_AnswerX{
	left: 46px;
}

.BIGM_Player2_AnswerX{
	left: 674px;
}

#BIGM_Player1_Answer1, #BIGM_Player2_Answer1{
	top: 47px;
}

#BIGM_Player1_Answer2, #BIGM_Player2_Answer2{
	top: 165px;
}

#BIGM_Player1_Answer3, #BIGM_Player2_Answer3{
	top: 283px;
}

#BIGM_Player1_Answer4, #BIGM_Player2_Answer4{
	top: 404px;
}

#BIGM_Player1_Answer5, #BIGM_Player2_Answer5{
	top: 523px;
}

.BIGM_PlayerX_Answer_TextX{
	position: absolute;
	top:0px;
	left:0px;
	width: 448px;
	height: 100%;
	
	border-radius: 10px;
	background-color: #000000;
	
	font-size: 40px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.BIGM_PlayerX_Answer_Text_CoverX{
	position: absolute;
	top:0px;
	left:0px;
	width: 448px;
	height: 100%;
	
	border-radius: 10px;
	background-color: #000000;
}

.Reveal2 .BIGM_PlayerX_Answer_Text_CoverX, .Reveal3 .BIGM_PlayerX_Answer_Text_CoverX{
	animation-name: BIGM_Answer_Cover_Shrink;
    animation-duration: 0.4s;
    animation-timing-function: linear;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}

.Reveal3 .BIGM_PlayerX_Answer_Points_CoverX{
	display: none!important;
}
    
@keyframes BIGM_Answer_Cover_Shrink {  
    0% {clip-path: inset(0 0 0 0);}
    100% {clip-path: inset(0 0 0 100%);}
}

.BIGM_PlayerX_Answer_PointsX{
	position: absolute;
	top:0px;
	left:472px;
	width: 112px;
	height: 103px;
	
	border-radius: 10px;
	background-color: #000000;
	
	font-size: 65px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.BIGM_PlayerX_Answer_Points_CoverX{
	position: absolute;
	top:0px;
	left:472px;
	width: 112px;
	height: 103px;
	
	border-radius: 10px;
	background-color: #000000;
}

.Reveal3 .BIGM_PlayerX_Answer_Points_CoverX{
	display: none;
}

.BIGM_PlayerX_Answer_RevealX{
	position: absolute;
	top:0px;
	left:0px;
	width: 112px;
	height: 103px;
	
	border-radius: 10px;
	opacity: 0.5;
	
	display: none;
}

.Reveal2 .BIGM_PlayerX_Answer_RevealX, .Reveal3 .BIGM_PlayerX_Answer_RevealX{
	display: block;
	
	animation-name: BIGM_Reveal_Blinker_Blink, BIGM_Reveal_Blinker_Move;
    animation-duration: 0.5s, 0.5s;
    animation-timing-function: linear, ease-in-out;
    animation-iteration-count: infinite, 1;
    animation-fill-mode: forwards;
}

.Reveal3 .BIGM_PlayerX_Answer_RevealX{
	display: none;
}

@keyframes BIGM_Reveal_Blinker_Blink {  
    0% { background: #fc0d1b; }
    50% { background: #660303; }
    100% { background: #fc0d1b; }
}
@keyframes BIGM_Reveal_Blinker_Move {  
    0% { transform: translateX(0); }
    100% { transform: translateX(472px); }
}

.BIGM_Total_LabelX{
	position: absolute;
	width: 220px;
	height: 104px;
	
	font-size: 50px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    border-radius: 10px;
	background-color: #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#BIGM_Total_Label1{
	top: 649px;
	left: 216px;
}

#BIGM_Total_Label2{
	top: 649px;
	left: 845px;
}

.BIGM_Total_PointsX{
	position: absolute;
	width: 176px;
	height: 104px;
	
	font-size: 70px;
    color: #FFFFFF;
    font-weight: bold;
    text-shadow: 2px 2px 6px #000000;
    
    border-radius: 10px;
	background-color: #000000;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#BIGM_Total_Points1{
	top: 649px;
	left: 454px;
}

#BIGM_Total_Points2{
	top: 649px;
	left: 1083px;
}

#BIGM_Timer{
	position: absolute;
	top: 210px;
	left: 304px;
	width: 1312px;
	height: 783px;
	
	font-size: 800px;
	color: rgba(255, 0, 0, 0.4);
	font-weight:bold;
	text-shadow: 5px 5px 100px #000000;
	
	display: none;
	justify-content: center;
	align-items: center;
    text-align: center;
}

#BIGM_Logo_Background{
	position: absolute;
	top: 210px;
	left: 304px;
	width: 1312px;
	height: 783px;
	
	background-image:url('resources/images/XXXX_Background.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	border-radius: 60px;
	
	opacity: 1;
	transition: opacity 0.5s ease-in-out;
}

.BIGM_Logo_Background_Fade{
	opacity: 0!important;
}

#BIGM_Logo{
	position: absolute;
	width: 1022px;
	height: 548px;
	top: 56px;
	left: 145px;
	
	background-image:url('resources/images/XXXX_Logo.png');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
}

#BIGM_Multiplier{
	position: absolute;
	top: 620px;
	left: 0px;
	width: 100%;
	height: 150px;
	
	font-size: 130px;
	color: #FFFFFF;
	font-weight:bold;
	text-shadow: 5px 5px 100px #000000;
	
	display: flex;
	justify-content: center;
	align-items: center;
    text-align: center;
    
	animation: BIGM_Multiplier_Animation 1.5s ease-out 1.0s forwards, BIGM_Multiplier_Glow 0.5s infinite alternate;
	opacity: 0;
	transform: translateX(-90px);
}
@keyframes BIGM_Multiplier_Animation{
	20% {
		opacity: 0;
	}
	60% {
		transform: translateX(20px);
	}
	75% {
		transform: translateX(-10px);
	}
	100% {
		opacity: 1;
		transform: translateX(0px);
	}
}
@keyframes BIGM_Multiplier_Glow{
  from{text-shadow:0px 0px 5px #fff,0px 0px 5px #614ad3;}
  to{text-shadow:0px 0px 20px #fff,0px 0px 20px #614ad3;}
}

#BIGM_AlertText{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	
	font-size: 250px;
	color: #d5bb50;
	font-weight:bold;
	text-shadow: 0 1px 0 #17202A, 0 2px 0 #17202A, 0 7px 0 #17202A, 0 8px 0 #17202A, 0 11px 0 #17202A, 0 12px 0 #17202A;
	
	display: none;
	justify-content: center;
	align-items: center;
    text-align: center;
}

#BIGM_Confetti{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	
	background-image:url('resources/images/BIGM_Confetti.gif');
	background-size:100% 100%;
	background-position:center;
	background-repeat:no-repeat;
	
	display:none;
}

#BIGM_Fireworks{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	
	background-image:url('resources/images/BIGM_Fireworks.gif');
	
	display:none;
}
/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------------------- */