*, *:before, *:after{
	box-sizing:border-box;
	padding:0;
}

html, body{
	height:100%;
	width:100%;
	margin:0;
}

#header{
	position:absolute;
	width:810px;
	left:0;
	right:0;
	top:20px;
	margin:auto;
}

#mapWrap{
	width:100%;
	height:100%;
}

#map{
	width:100%;
	height:100%;
	background-color:black;
	background-image:url("../images/buttons_small/background.jpg");
	background-position: center;
	background-repeat: no-repeat;
}

a{
	text-decoration:none;
	outline:none;
}
.buttonWrap{
	position:absolute;

}
.button{
	width:30px;
	height:30px;
	text-align:center;
}

@media (min-width:1081px){

	#button01{
		left:10%;
		top:10%;
	}

	#button02{
		left:15%;
		top:25%;
	}

	#button03{
		left:20%;
		top:40%;
	}

	#button04{
		left:10%;
		top:55%;
	}

	#button05{
		left:23%;
		top:65%;
	}

	#button06{
		left:45%;
		top:77%;
	}

	#button07{
		left:60%;
		top:60%;
	}

	#button08{
		left:60%;
		top:46%;
	}

	#button09{
		left:55%;
		top:30%;
	}

	#button10{
		left:60%;
		top:15%;
	}
}


@media (max-width:1080px){
	#header{
		max-width: 100%;
	}
	.buttonWrap{
		position:absolute;
	}

	.buttonWrap:nth-child(odd){
		left:5%;
	}
	.buttonWrap:nth-child(even){
		right:5%;
	}
	#button01{
		top:7%;
	}
	#button02{
		top:15.66%;
	}
	#button03{
		top:24.33%;
	}
	#button04{
		top:33%;
	}
	#button05{
		top:41.66%;
	}
	#button06{
		top:50.33%;
	}
	#button07{
		top:59%;
	}
	#button08{
		top:67.66%;
	}
	#button09{
		top:76.33%;
	}
	#button10{
		top:85%;
	}
}