body {
	margin:0;
	padding:0;
}

.map {
	position: relative;
	display: block;
	margin:0 auto;
	width: 1200px;
}

svg {
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
}

.svg-hide {
	display: none;
}

.floor {
	opacity: 0;
}

.floor:hover {
	transition: opacity 0.2s ease;
	opacity: 0.5;
	cursor: pointer;
}

.floor-number {
	position: absolute;
	color:#ffffff;
	right: 400px;
	top:0px;
	font-weight: bold;
	font-size: 18px;
	line-height: 18px;
}

.modal {
	display: none;
	position: fixed;
	top: 50%;
  	left: 50%;
  	margin-left: -500px;
  	margin-top: -300px;
	width:1000px;
	height: 600px;
	z-index: 10;
	background-color:#ffffff;
	border:10px solid grey;
}

.modal-show {
	display: block;
}

.modal-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 6;
}

.overlay-show {
 	display: block;
}

.modal-title {
	text-align: center;
}

.plan-wrapper {
	position: relative;
}

.plan-img {
	display: block;
}

.flat {
	opacity: 0;
}

.flat.flat-sold {
	opacity: 0.6;
}

.flat:hover {
	transition: opacity 0.2s ease;
	opacity: 0.6;
	cursor: pointer;
}

.flat-metres {
	position: absolute;
	width:50px;
	height: 30px;
	border-radius: 10px;
	text-align: center;
	padding: 5px;
	right: 20px;
	top:0;
}