@font-face {
	font-family: "pixel";
	src: url("./pixel.ttf") format("truetype");
	font-style: normal;
	font-weight: normal;
}

.active{
	position: relative;
}

#topPeople, #bottomPeople{
	position: absolute;
	width: 165px;
	height: 60px;
	cursor: pointer; 
}

#topPeople{
	left:530px;
	top:96px;
}

#bottomPeople{
	left:530px;
	top:244px;
}

body{
	background-repeat: repeat;
	padding: 20px 0;
	font-family: pixel;
	height: 100%;
	width:700px;
	margin: 0 auto;
}

#start{
	font-size: 25px;
	top: 160px;
	left: 250px;
}

.button {
	position: absolute;
	min-width: 12px;
	box-shadow: 3px 4px 0px 0px #8a2a21;
	background:linear-gradient(to bottom, #c62d1f 5%, #f24437 100%);
	background-color:#c62d1f;
	border-radius:18px;
	border:1px solid #d02718;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-size:17px;
	padding:7px 25px;
	text-decoration:none;
	text-shadow:0px 1px 0px #810e05;
}
.button:hover {
	background:linear-gradient(to bottom, #f24437 5%, #c62d1f 100%);
	background-color:#f24437;
}

.button.active{
	border:1px solid #268a16;
	box-shadow: 3px 4px 0px 0px #308020;
	background:linear-gradient(to bottom, #77d42a 5%, #5cb811 100%);
	background-color:#77d42a;
}

.button.active:hover {
	background:linear-gradient(to bottom, #5cb811 5%, #77d42a 100%);
	background-color:#5cb811;
}

#topWay{
	left:460px;
	top:90px;
}

#bottomWay{
	left:460px;
	top:240px;
}

#hideInfo{
	left:610px;
	top:20px;
}