html {
	height: 100%;
}

body {
	height: 100%;
}

#game {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

.map {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

.map .layers {
	position: relative;
}

.map .background {
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url(/resources/map.png);
	background-size: no-repeat;
	background-size: cover;
	cursor: grab;
	z-index: 100;
}

.map .logic {
	position: absolute;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 101;
}

.city {
	cursor: pointer;
}

.city.hover * {
	filter: drop-shadow(0px 0px 5px #489dff);
}

.path {
	cursor: pointer;
}

.path.hover * {
	filter: drop-shadow(0px 0px 5px #489dff);
}