/* -------------------------------------- Main Layout Items -------------------------------------- */
#GAME_DUK_Main_Container{
	width:100%;
	height:100%;
	
	background-image:url('../../images/DUK_Board.png');
	background-position:right;
	background-repeat:no-repeat;
	background-size:100% 100%;
	
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction: column;
	
	overflow:hidden;
}
#GAME_DUK_Info_Container{
	width:100%;
	height:85%;
	display:flex;
}
#GAME_DUK_Left_Container, #GAME_DUK_right_Container{
	width:23%;
	height:100%;
	display:flex;
	align-items: center;
	flex-direction: column;
	justify-content: space-evenly;
	transition: width 0.3s ease;
}
.GAMEFRAME_Input_Visible #GAME_DUK_Left_Container, .GAMEFRAME_Input_Visible #GAME_DUK_right_Container{
	width:23%;
}
#GAME_DUK_Middle_Container{
	position: relative;
	width:54%;
	height:100%;
	
	display: flex;
	align-items: center;
	justify-content: end;
	
	transition: width 0.3s ease;
}
/* ----------------------------------------------------------------------------------------------- */



/* ------------------------------------- Player Layout Items ------------------------------------- */
.GAME_DUK_Player_Info_Left, .GAME_DUK_Player_Info_Right{
	height: 100px;
	width: 100%;
	color: #d5d5d5;
	display: flex;
	align-items: center;
	cursor: pointer;
}
.GAME_DUK_Player_Info_Left{
	border-radius: 0 25px 25px 0;
}
.GAME_DUK_Player_Info_Right{
	border-radius: 25px 0 0 25px;
}

.GAME_DUK_Player_Info_Left.GAME_DUK_Player_Active, .GAME_DUK_Player_Info_Right.GAME_DUK_Player_Active{
	color: #FFFFFF;
	border: 5px solid #FFFFFF;
	box-shadow: 0px 0px 25px #000000;
	height: 130px;
}
.GAME_DUK_Player_Info_Left.GAME_DUK_Player_Active{
	border-left: none;
}
.GAME_DUK_Player_Info_Right.GAME_DUK_Player_Active{
	border-right: none;
}
.GAME_DUK_Player_Info_Number{
	width: 30%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight:bold;
	font-size: 65px;
	text-shadow: 0px 0px 10px #000000;
	
	transition: font 0.3s ease;
}
.GAMEFRAME_Input_Visible .GAME_DUK_Player_Info_Number{
	font-size: 55px;
}
.GAME_DUK_Player_Info_Name{
	width: 70%;
	height: 90%;
    background: #1A1A1A;
	
	font-weight:bold;
	font-size: 42px;
	text-shadow: 0px 0px 10px #000000;
	
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	
	transition: font 0.3s ease;
}
.GAMEFRAME_Input_Visible .GAME_DUK_Player_Info_Name{
	font-size: 35px;
}
/* ----------------------------------------------------------------------------------------------- */



/* ------------------------------------- Dartboard Container ------------------------------------- */
#GAME_DUK_DARTBOARD_Container{
	position: relative;
	width:100%;
	height:95%;
	transition: height 0.3s ease;
}
/* ----------------------------------------------------------------------------------------------- */



/* ---------------------------------------- Duck Container --------------------------------------- */
#GAME_DUK_Race_Container{
	position: relative;
	width:100%;
	height:15%;
	display:flex;
}
.GAME_DUK_Player_Duck{
	position: absolute;
	width:calc(100% / 11);
	height:100%;
	
	display: flex;
	align-items: center;
	justify-content: center;
	
	transition: left 1.3s ease;
}
.GAME_DUK_Duck{
	position: absolute;
	width:auto;
	height:90%;
}
#DuckSplash{
	display: none;
}
.GAME_DUK_Active_Duck #DuckSplash{
	display: block;
}
#DuckOutline, #DuckColour{
	animation: GAME_DUK_Duck_Wobble 3.0s ease-in-out infinite;
}
.GAME_DUK_Active_Duck #DuckOutline, .GAME_DUK_Active_Duck #DuckColour{
	animation: GAME_DUK_Duck_Wobble 1.0s ease-in-out infinite;
}

@keyframes GAME_DUK_Duck_Wobble {
	0%, 100% {
		transform: rotate(0deg);
	}
	25% {
		transform: rotate(-2deg);
	}
	50% {
		transform: rotate(0deg);
	}
	75% {
		transform: rotate(-2deg);
	}
}
/* ----------------------------------------------------------------------------------------------- */