.mobile {
	display: none;
}

.box-map {
	background: url(../img_front/floorplan_bottom.jpg?v=2) no-repeat;
	height: 346px;
	width: 972px;
	min-width: 680px;
	min-height: 260px;
	position: relative;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	float: right;
}

.box-map--first {
	height: 370px;
}

.box-map:nth-of-type(1) {
	background-size: contain;
	background: url(../img_front/floorplan_top.jpg?v=2) no-repeat;
}

.btwInfo {
	margin-bottom: 2em;
}

.text--up {
	margin-top: -30px;
}

.box-map-scroll {
	margin: 2em 0;
}

.buttons div {
	padding: 0;
}

.buttons .styled-button {
	width: 100%;
	font-size: 16px;
	border: 0;
}
.buttons .styled-button:after {
    content: ' ';
    position: absolute;
    width: 0;
    height: 0;
    left: 50%;
    margin-left: -20px;
    bottom: -20px;
    border: 10px solid;
    display: none;
}

.buttons .styled-button.active {
	background-color: rgb(219, 199, 0);
}
.buttons .styled-button.active:after {
    border-color: rgb(219, 199, 0) transparent transparent transparent;
    display: block;
}
.buttons .styled-button:focus {outline:0;}

.floorplans > div {
	padding-top: 15px;
}
.floorplans img {
	width: 100%;
}

.mobile {
	margin: 2em 0;
}

	.box-item {
		height: 14.45%;
		border-radius: 25px;
		background: transparent;
		display: block;
		width: 5.54%;
		position: absolute;
		top: 0;
		left: 0;
		border: none;
		outline: none;
	}

	.box-item-1 {
		top: 69.9%;
		left: 8.9%;
	}
	.box-item-2 {
		top: 69.9%;
		left: 20.6%;
	}
	.box-item-3 {
		top: 69.9%;
		left: 32.2%;
	}
	.box-item-4 {
		top: 69.9%;
		left: 43.8%;
	}
	.box-item-5 {
		top: 69.9%;
		left: 55.2%;
	}
	.box-item-6 {
		top: 69.9%;
		left: 66.7%;
	}

	.box-item-7 {
    	top: 69.9%;
		left: 79.9%;
	}

	.box-item-8 {
		top: 69.9%;
		left: 89.9%;
	}

	.box-item-9 {
		top: 11.2%;
		left: 89.9%;
	}

	.box-item-10 {
		top: 11.2%;
		left: 79.9%;
	}
	
	.box-item-11 {
		top: 11.2%;
		left: 66.7%;
	}
	.box-item-12 {
		top: 11.2%;
		left: 55.2%;
	}
	.box-item-13 {
		top: 11.2%;
		left: 43.8%;
	}
	.box-item-14 {
		top: 11.2%;
		left: 32.2%;
	}
	.box-item-15 {
		top: 11.2%;
		left: 20.6%;
	}
	.box-item-16 {
		top: 11.2%;
		left: 8.9%;
	}
	.box-item-17 {
		top: 11.2%;
		left: 5.5%;
	}
	.box-item-18 {
		top: 11.2%;
		left: 16.1%;
	}
	.box-item-19 {
		top: 11.2%;
		left: 24.2%;
	}
	.box-item-20 {
		top: 11.2%;
		left: 33.3%;
	}
	.box-item-21 {
		top: 5%;
		left: 46.8%;
	}
	.box-item-22 {
		top: 18%;
		left: 46.8%;
	}
	.box-item-23 {
		top: 31%;
		left: 46.8%;
	}
	.box-item-24 {
		top: 11.2%;
		left: 52.5%;
	}
	.box-item-25 {
		top: 11.2%;
		left: 60.3%;
	}
	.box-item-26 {
		top: 11.2%;
		left: 68.6%;
	}
	.box-item-27 {
        top: 11.2%;
        left: 76.9%;
	}
	.box-item-28 {
        top: 11.2%;
        left: 85.2%;
	}
	.box-item-29 {
        top: 11.2%;
        left: 92.9%;
	}
	.box-item-30 {
		top: 65%;
		left: 93.1%;
	}
	.box-item-30a {
		top: 65%;
		left: 85.2%;
	}
	.box-item-30b {
		top: 65%;
		left: 77%;
	}
	.box-item-31 {
		top: 65%;
		left: 68.6%;
	}			
	.box-item-32 {
		top: 65%;
		left: 60.3%;
	}	
	.box-item-33 {
		top: 65%;
		left: 52%;
	}
	.box-item-34 {
		top: 65%;
		left: 43.8%;
	}
	.box-item-35 {
		top: 65%;
		left: 34%;
	}
	.box-item-36 {
		top: 65%;
		left: 25%;
	}	
	.box-item-37 {
		top: 60.4%;
		left: 16%;
	}
	.box-item-38 {
		top: 75.9%;
		left: 16%;
	}	
	
	.box-item-21, .box-item-22, .box-item-23 {
		height: 20px;
		width: 20px;
		border-radius: 20px;
	}					
	.box-item-21 span, .box-item-22 span, .box-item-23 span {
		font-size: 18px;
		text-align: left;
		vertical-align: top;
		line-height: 12px;
	}
	
	.box-item-37, .box-item-38 {
		height: 30px;
		width: 30px;
		border-radius: 30px;
	}
	.box-item-37 span, .box-item-38 span {
		font-size: 22px;
		text-align: left;
		vertical-align: top;
		line-height: 20px;
	}	
	
	.box-item-21 sup, .box-item-22 sup, .box-item-23 sup, .box-item-37 sup, .box-item-38 sup {
		display: none;
	}
	
    .available {
    	font-size: 27px;
    	font-weight: 900;
    	text-align: center;
        padding-top: 4px;
        background: rgb(247, 238, 0);
    }
    .unavailable {
    	font-size: 27px;
    	font-weight: 900;
    	text-align: center;
        padding-top: 4px;
        background: rgb(125, 125, 125);
    }
    .available sup, .unavailable sup {
    	font-size: 13px;
    	right: 10px;
    	top: 15px;
    	position: absolute;
    }
    
    a.available, a.available:visited, a.available:hover, a.available:active, a.available:focus,
    a.unavailable, a.unavailable:visited, a.unavailable:hover, a.unavailable:active, a.unavailable:focus {
    	text-decoration: none !important;
    	cursor: default;
    }
	.popover {
		color: #333;
	}

	.popover span {
		display: block;
		float: left;
		clear: both;
		width: 35px;
		margin-bottom: 2px;
		color: #aaa;
	}

	.popover strong {
		display: block;
		float: left;
		color: #333;
	}

	.popover-content {
		overflow: hidden;
	}

	@media screen and (max-width: 902px) {
		.box-map {
			width: 100%;
			height: auto;
			padding-bottom: 38.35%;
			float: none;
		}
		.box-map:nth-of-type(1) {
			width: 902px;
			height: 346px;
		}
	}

	@media screen and (max-width: 680px) {
		.mobile {
			display: block;
		}
		.box-map-scroll {
			display: none;
		
		}
		.box-item {
			height: 50px;
			border-radius: 25px;
			width: 50px;
		}
		
		.box-map-scroll {
			width: 100%;
			overflow-x: scroll;
			overflow-y: visible;
		}
		
		.box-item-1 {
			top: 11%;
			left: 15%;
		}
		.box-item-2 {
			top: 22%;
			left: 15%;
		}
		.box-item-3 {
			top: 33%;
			left: 15%;
		}
		.box-item-4 {
			top: 44.5%;
			left: 15%;
		}
		.box-item-5 {
			top: 55.7%;
			left: 15%;
		}
		.box-item-6 {
			top: 67.5%;
			left: 15%;
		}

		.box-item-7 {
			top: 80%;
			left: 15%;
		}

		.box-item-8 {
			top: 90%;
			left: 15%;
		}

		.box-item-9 {
			top: 90%;
			left: 70%;
		}

		.box-item-10 {
			top: 80%;
			left: 70%;
		}

		.box-item-11 {
			top: 67.5%;
			left: 70%;
		}
		.box-item-12 {
			top: 55.7%;
			left: 70%;
		}
		.box-item-13 {
			top: 44.5%;
			left: 70%;
		}
		.box-item-14 {
			top: 33%;
			left: 70%;
		}
		.box-item-15 {
			top: 22%;
			left: 70%;
		}
		.box-item-16 {
			top: 11%;
			left: 70%;
		}
		.box-item-17 {
			top: 8.5%;
			left: 70%;
		}
		.box-item-18 {
			top: 17.8%;
			left: 70%;
		}
		.box-item-19 {
			top: 26.2%;
			left: 70%;
		}
		.box-item-20 {
			top: 35.5%;
			left: 70%;
		}
		.box-item-21 {
			top: 47.5%;
			left: 86%;
		}
		.box-item-22 {
			top: 47.5%;
			left: 71.5%;
		}
		.box-item-23 {
			top: 47.5%;
			left: 58.5%;
		}
		.box-item-24 {
			top: 54%;
			left: 70%;
		}
		.box-item-25 {
			top: 62%;
			left: 70%;
		}
		.box-item-26 {
			top: 70.2%;
			left: 70%;
		}
		.box-item-27 {
            top: 78.3%;
            left: 70%;
		}
		.box-item-28 {
			top: 86.3%;
            left: 70%;
		}
		.box-item-29 {
            top: 94.3%;
            left: 70%;
		}
		.box-item-30 {
            top: 94.3%;
            left: 15%;
		}
		.box-item-30a {
            top: 86.3%;
            left: 15%;
		}
		.box-item-30b {
            top: 78.3%;
            left: 15%;
		}
		.box-item-31 {
			top: 70.2%;
			left: 15%;
		}			
		.box-item-32 {
			top: 61.8%;
			left: 15%;
		}	
		.box-item-33 {
			top: 53.5%;
			left: 15%;
		}
		.box-item-34 {
			top: 45.3%;
			left: 15%;
		}
		.box-item-35 {
			top: 35.8%;
			left: 15%;
		}
		.box-item-36 {
			top: 26.7%;
			left: 15%;
		}	
		.box-item-37 {
			top: 17.5%;
			left: 25%;
		}
		.box-item-38 {
			top: 17.5%;
			left: 9%;
		}	
		
		.box-item-21, .box-item-22, .box-item-23 {
			height: 25px;
			width: 25px;
			border-radius: 12.5px;
		}			
		.box-item-37, .box-item-38 {
			height: 30px;
			width: 30px;
			border-radius: 15px;
		}		
	}