#Overworld {
	
	width: 1024px;
	height: 768px;
	background-image: url('../images/overworld/backdrop.png');
	
	.overlay {
		width: 1024px;
		height: 768px;
		position: absolute;
		left: 0px;
		top: 0px;
		background-image: url('../images/overworld/backdrop-overlay.png');
		pointer-events: none;
	}
	
	.location {
		position: absolute;
		border-radius: 5px;
		
		.location-title {
			text-align: center;
			font-weight: bold;
			color: white;
		}
		
		.display {
			position: absolute;
			left: 0px;
			top: 0px;
			width: 100%;
			height: 100%;
		}
		
		.lock, .for-rent {
			position: absolute;
			left: 0px;
			top: 0px;
			width: 100%;
			height: 100%;
			opacity: 0;
			display: flex;
			flex-direction: column;
			justify-content: center;
		}
		
		&.isLocked {
			
			.display {
				filter: brightness( 0.25 );
			}
			.lock {
				opacity: 1;
			}
			
			.location-title {
				background-image: url( '../images/overworld/locked.png' );
				background-repeat: no-repeat;
				background-position: center top;
				padding-top: 55px;
			}
		}
		
		&.isForRent {
			.display {
				filter: brightness( 0.5 );
			}
			.for-rent {
				opacity: 1;
			}
			.location-title {
				background-image: url( '../images/overworld/for-rent.png' );
				background-repeat: no-repeat;
				background-position: center top;
				padding-top: 55px;
			}
		}
		
	}

	#trading {
		left: 565px;
		top: 50px;
		width: 370px;
		height: 200px;
		
		.display {
			background-image: url('../images/overworld/trading-post-en.png');
		}
	}
	
	#school {
		left: 750px;
		top: 270px;
		width: 120px;
		height: 90px;
		
		.display {
			background-image: url('../images/overworld/school.png');
		}
	}
	
	#home-0 {
		left: 360px;
		top: 80px;
		width: 162px;
		height: 125px;
		.display {
			background-image: url('../images/overworld/home-0.png');
		}
	}

	#home-1 {
		left: 340px;
		top: 220px;
		width: 158px;
		height: 111px;
		.display {
			background-image: url('../images/overworld/home-1.png');
		}
	}
	
	#home-2 {
		left: 610px;
		top: 460px;
		width: 233px;
		height: 160px;
		.display {
			background-image: url('../images/overworld/home-2.png');
		}
	}
	
	#site-1 {
		left: 20px;
		top: 230px;
		width: 291px;
		height: 193px;
		.display {
			background-image: url('../images/overworld/site-1.png');
		}
	}

	#site-2 {
		left: 410px;
		top: 272px;
		width: 243px;
		height: 214px;
		.display {
			background-image: url('../images/overworld/site-2.png');
		}
	}

	#site-3 {
		left: 134px;
		top: 407px;
		width: 344px;
		height: 328px;
		.display {
			background-image: url('../images/overworld/site-3.png');
		}
	}
	
}