@media screen and (max-width: 970px) {
	body {
		align-items: flex-start;
	}
	
	#boxContainer {
		flex-wrap: wrap;
		height: 100%;
		justify-content: center;
		align-items: center;
		flex-direction: row-reverse;
		gap: 20px;
	}
	
	#gameBox {
		width: 330px;
		height: 230px;
		margin-top: 0;
	}
		
	#playerBox {
		width: 100%;
		height: 65%;
		margin-bottom: 0;
		background-position: bottom right;
	}
	
	#game-players-container {
		flex-direction: row;
		flex-wrap: wrap;
	}
	
	#players-container {
		height: 95%;
	}
	
	.defaultPlayer {
		height: 250px;
		width: 330px;
		font-size: 16px;
		background-size: cover;
	}
	
	.secondExpendable {
		margin: 10px;
	}
	
	#moneyBox {
		width: 300px;
		height: 110px;
		padding: 10px;
		display: flex;
		flex-direction: row;
		text-align: center;
		align-items: center;
		justify-content: center;
		gap: 15px;
	}

	.chipDisplay {
		height: 100%;
		width: 85px;
		background-repeat: no-repeat;
		background-size: contain;
		background-position: center;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		user-select: none;
	}
	
	.chipInputs {
		gap: 10px;
	}
	
	#passwordCheck, #passwordChange {
			width: 70%;
	}
		
	#rotatingLogo {
		width: 80px;
		height: 80px;
	}

	.outer-container {
		top: 100%;
		left: 100%;
		transform: translate(-100%, -100%);
		width: 90px;
		height: 90px;
	}
}

@media screen and (max-width: 510px) {
	body {
		overflow-y: scroll;
		flex-wrap: nowrap;
		padding: 15px 0;
	}
	
	#boxContainer {
		flex-direction: column-reverse;
		flex-wrap: nowrap;
		align-items: center;
		overflow: visible;
		height: auto;
	}
	
	#moneyBox {
		padding: 0;
		flex-direction: row;
		height: 60px;
		width:100%;
	}
	
	#gameBox {
		width: 90%;
		height: auto;
		margin: 0;
	}
	
	#playerBox {
		width: 95%;
		height: 650px;
		margin: 0;
		padding: 20px;
	}
	
	#players-container {
		gap: 15px;
		flex-direction: column;
		width: 100%;
		flex-wrap: nowrap;
	}
	
	.defaultPlayer {
		font-size: 18px;
		width: 90%;
		height: 23%;
		flex-direction: column;
		display: flex;
		flex-wrap: wrap;
		background-size: contain;
		background-repeat: repeat;
		align-items: stretch;
		justify-content: space-evenly;
		align-content: space-between;
		box-shadow: 
			inset 0px -2px 0px rgba(0, 0, 0, 0.6),
			0px 2px 4px rgba(0, 0, 0, 0.7),
			0px 4px 8px rgba(0, 0, 0, 0.6);
	}
	
	.defaultPlayer span {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		justify-content: center;
		width: 50%;
		height: 100%;
	}

	#boxContainer .defaultPlayer .nickNameP {
		font-size: 15px;
	}
	
	.defaultPlayer h3 {
		font-size: 16px;
		margin: 0;
		max-width: 100%;
	}
	
	#players-container .defaultPlayer p {
		margin: 0;
		font-size: 14px;
	}
	
	.defaultPlayer .nickNameP {
		font-style: italic;
		color: #666;
		font-size: 15px;
	}

	.isReady {
		position: absolute;
		margin-top: 25px;
		width: calc(100% - 30px);
		margin-top: 25px;
		text-shadow: 
			1px 1px 1px white,
			-1px -1px 1px white,
			-1px 1px 1px white,
			1px -1px 1px white;
	}
	
	#game-players-container button {
		padding: 5px 10px;
		margin-bottom: 10px;
		min-width: 120px;
	}
	
	#game-players-container button:disabled {
		display: none;
	}
	
	#gameBox #game-players-container #finish-count-button:disabled {
		display: block;
	}
	
	.bottomHalf {
		margin-bottom: 0;
	}
	
	#passwordCheck, #passwordChange {
		width: 90%;
		height: 90%;
	}
	
	#messageDiv {
		padding: 10px;
		text-align: center;
	}
	
	#rotatingLogo {
		width: 50px;
		height: 50px;
	}

	.outer-container {
		top: 100%;
		left: 100%;
		transform: translate(-100%, -100%);
		width: 60px;
		height: 60px;
	}
}