.tree,
		.tree ul {
		margin:0 0 0 1em; /* indentation */
		padding:0;
		list-style:none;
		color:#369;
		position:relative;
		}

		.tree ul {margin-left:.5em} /* (indentation/2) */

		.tree:before,
		.tree ul:before {
		content:"";
		display:block;
		width:0;
		position:absolute;
		top:0;
		bottom:0;
		left:0;
		border-left:1px solid;
		}

		.tree li {
		margin:0;
		padding:0 1em; /* indentation + .5em */
		line-height:2em; /* default list item's `line-height` */
		font-weight:normal;
		position:relative;
		white-space: nowrap;
		}

		.tree li:before {
		content:"";
		display:block;
		width:10px; /* same with indentation */
		height:0;
		border-top:1px solid;
		margin-top:-1px; /* border top width */
		position:absolute;
		top:1em; /* (line-height/2) */
		left:0;
		}

		.tree li:last-child:before {
		background:white; /* same with body background */
		height:auto;
		top:1em; /* (line-height/2) */
		bottom:0;
		}
	
		.zone_town {
			color: #39bcf9;
			font-weight: bold;
		}
	
		.zone_field {
			color: #22CC22;
			font-weight: bold;
		}
	
		.zone_dungeon {
			color: #f26907;
			font-weight: bold;
		}
	
		.zone_empty {
			color: #a3a3a3;
			font-weight: bold;
		}