/* SECTION & FRAME */

.hp-section.alt-inverted {color:#fff;}
.hp-section.alt-grey {background:#D3D1D1;}
.hp-section.alt-grey2 {background:#8D8989;}

.hp-frame {
	padding: 80px 40px;
	max-width: 1150px;
	margin: 0 auto;
}

.hp-frame + .hp-frame {
	padding-top: 0 !important;
}

.hp-frame.alt-full {max-width:none;}

@media screen and (min-width: 901px) {
	.hp-section.alt-offset {box-shadow: inset 0 -160px 0 #fff;}
	.hp-frame.alt-wide {max-width:1500px;}
	.hp-frame.alt-narrow {max-width:900px;}
	.hp-frame.alt-collapse {padding-top:0; padding-bottom:0; overflow:hidden;}
}

@media screen and (max-width: 900px) {
	.hp-frame {max-width:400px; padding:40px 20px;}
	.hp-frame.alt-loose {padding-top:80px; padding-bottom:80px;}
}



/* COLUMNS */

.hp-columns {
	font-size: 0;
	line-height: 0;
	margin: -20px;
}
	
.hp-columns > .hp-column {
	padding: 20px;
	vertical-align: top;
	display: inline-block;
	box-sizing: border-box;
	width: 100%;
}

.hp-columns > .hp-column[data-width="1/2"] {width:50.00%;}
.hp-columns > .hp-column[data-width="1/3"] {width:33.33%;}
.hp-columns > .hp-column[data-width="1/4"] {width:25.00%;}
.hp-columns > .hp-column[data-width="1/5"] {width:20.00%;}
.hp-columns > .hp-column[data-width="1/6"] {width:16.66%;}
.hp-columns > .hp-column[data-width="1/7"] {width:14.27%;}
.hp-columns > .hp-column[data-width="1/8"] {width:12.50%;}

.hp-columns > .hp-column[data-width="2/3"] {width:66.66%;}
.hp-columns > .hp-column[data-width="2/4"] {width:50.00%;}
.hp-columns > .hp-column[data-width="2/5"] {width:40.00%;}
.hp-columns > .hp-column[data-width="2/6"] {width:33.33%;}
.hp-columns > .hp-column[data-width="2/7"] {width:28.56%;}
.hp-columns > .hp-column[data-width="2/8"] {width:25.00%;}

.hp-columns > .hp-column[data-width="3/4"] {width:75.00%;}
.hp-columns > .hp-column[data-width="3/5"] {width:60.00%;}
.hp-columns > .hp-column[data-width="3/6"] {width:50.00%;}
.hp-columns > .hp-column[data-width="3/7"] {width:42.84%;}
.hp-columns > .hp-column[data-width="3/8"] {width:37.50%;}

.hp-columns > .hp-column[data-width="4/5"] {width:80.00%;}
.hp-columns > .hp-column[data-width="4/6"] {width:66.66%;}
.hp-columns > .hp-column[data-width="4/7"] {width:57.13%;}
.hp-columns > .hp-column[data-width="4/8"] {width:50.00%;}

.hp-columns > .hp-column[data-width="5/6"] {width:83.33%;}
.hp-columns > .hp-column[data-width="5/7"] {width:71.41%;}
.hp-columns > .hp-column[data-width="5/8"] {width:62.50%;}

.hp-columns > .hp-column[data-width="6/7"] {width:85.70%;}
.hp-columns > .hp-column[data-width="6/8"] {width:75.00%;}

.hp-columns > .hp-column[data-width="7/8"] {width:87.50%;}

/* alts */

.hp-columns.alt-tight {margin:-10px;}
.hp-columns.alt-tight > .hp-column {padding:10px;}

.hp-columns.alt-collapse {margin:0;}
.hp-columns.alt-collapse > .hp-column {padding:0;}

.hp-columns.alt-center {text-align:center;}
.hp-columns.alt-middle > .hp-column {vertical-align:middle;}

@media screen and (min-width: 1201px) {
	.hp-columns.alt-loose {margin:-40px;}
	.hp-columns.alt-loose > .hp-column {padding:40px;}
}

@media screen and (max-width: 900px) {
	.hp-columns > .hp-column[data-width] {display:block; width:auto;}
	.hp-columns > .hp-column[data-width]:empty {display:none;}
}



/* TEXT */

html body .hp-container .hp-body {
	color: #414141;
	font-family: oswald, sans-serif;
	overflow: hidden;
	max-width: 100%;
}

html body .hp-container .hp-body,
html body .hp-container .hp-body .hp-column {
	font-size: 20px;
	line-height: 30px;
}

.hp-body h1,
.hp-body h2,
.hp-body h3,
.hp-body h4,
.hp-body h5,
.hp-body h6 {font-weight:400; text-transform:uppercase;}

.hp-body h1 {font-size:65px; line-height:75px;}
.hp-body h2 {font-size:50px; line-height:55px;}
.hp-body h3 {font-size:28px; line-height:34px;}
.hp-body h4 {font-size:26px; line-height:32px;}
.hp-body h5 {}
.hp-body h6 {}

.hp-body p,
.hp-body ol,
.hp-body ul {
	margin: 20px 0;
}

.hp-body p:first-child,
.hp-body ol:first-child,
.hp-body ul:first-child,
.hp-body li:first-child {margin-top:0;}
.hp-body p:last-child,
.hp-body ol:last-child,
.hp-body ul:last-child,
.hp-body li:last-child {margin-bottom:0;}

.hp-body a {color:#414141;}

@media screen and (max-width: 900px) {
	html body .hp-container .hp-body,
	html body .hp-container .hp-body .hp-column {font-size:18px; line-height:28px;}
	.hp-body h1 {font-size:40px; line-height:48px;}
	.hp-body h2 {font-size:28px; line-height:36px;}
	.hp-body h3 {font-size:22px; line-height:30px;}
	.hp-body h4 {font-size:22px; line-height:30px;}
}



/* IMAGES */

.hp-image {
	position: relative;
	margin: 0 auto;
	background: #414141 no-repeat center;
	background-size: cover;
}

.hp-image::after {
	content: "";
	display: block;
}

.hp-image[data-ratio="16:9"]::after {padding-bottom:56.25%;}
.hp-image[data-ratio="4:3"]::after {padding-bottom:75%;}
.hp-image[data-ratio="3:2"]::after {padding-bottom:66.66%;}
.hp-image[data-ratio="1:1"]::after {padding-bottom:100%;}

.hp-image iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}

.hp-image ol {
	list-style: none;
	margin: 0;
	padding: 0;
}

.hp-image li {
	position: absolute;
	margin: -15px 0 0 -15px !important;
	padding: 0;
}

.hp-image li span:first-child {
	display: block;
	width: 30px;
	height: 30px;
	background: #FDB913;
	color: #424343;
	font-size: 20px;
	text-align: center;
	line-height: 30px;
}

.hp-image li span:last-child {
	position: absolute;
	top: 60px;
	left: 15px;
	display: none;
	background: #414141;
	color: #FDB913;
	font-size: 20px;
	line-height: 22px;
	padding: 6px 10px 8px;
	text-transform: uppercase;
	z-index: 1;
	white-space: nowrap;
}

.hp-image li span:last-child::before {
	content: "";
    display: block;
    z-index: -1;
    border: 0 solid transparent;
    border-width: 30px 15px;
    border-left-color: #414141;
    position: absolute;
    top: -30px;
    left: 0;
}

.hp-image li span:first-child:hover + span {
	display: block;
}

.hp-image li.alt-flipped span:last-child {left:auto; right:15px;}
.hp-image li.alt-flipped span:last-child::before {border-left-color:transparent; border-right-color:#414141; left:auto; right:0;}

@media screen and (max-width: 900px) {
	.hp-image li span:first-child {width:20px; height:20px; line-height:19px; font-size:15px;}
	.hp-image li span:last-child::before {display:none;}
	.hp-image li span:last-child {line-height:22px; font-size:18px; text-align:center; position:fixed; padding:6px 20px;
		top:auto; bottom:0; left:0; right:0;}
	.hp-image li.alt-flipped span:last-child {top:auto; bottom:0; left:0; right:0;}
}



/* SPACERS */

.hp-spacer {
	display: block;
	clear: both;
}

.hp-spacer[data-height="20"] {height:20px;}
.hp-spacer[data-height="40"] {height:40px;}
.hp-spacer[data-height="80"] {height:80px;}

@media screen and (max-width: 900px) {
	.b-spacer[data-height="80"] {height:40px;}
}



/* UTILITY */


.hp-button {
	display: inline-block;
	background: #e7ab28;
	line-height: 50px;
	height: 50px;
	color: #414141;
	text-transform: uppercase;
	padding: 0 30px;
	text-decoration: none;
	letter-spacing: 0.05em;
}

.hp-hidden {
	display: none !important;
}

.hp-center {
	text-align: center !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

@media screen and (max-width: 1800px) {
	.hp-hidden-1800 {display:none !important;}
	.hp-center-1800 {text-align:center !important; margin-left:auto !important; margin-right:auto !important;}
}

@media screen and (max-width: 1200px) {
	.hp-hidden-1200 {display:none !important;}
	.hp-center-1200 {text-align:center !important; margin-left:auto !important; margin-right:auto !important;}
}

@media screen and (max-width: 900px) {
	.hp-hidden-900 {display:none !important;}
	.hp-center-900 {text-align:center !important; margin-left:auto !important; margin-right:auto !important;}
}

@media screen and (max-width: 600px) {
	.hp-hidden-600 {display:none !important;}
	.hp-center-600 {text-align:center !important; margin-left:auto !important; margin-right:auto !important;}
}






/* HP-HOME-INTRO */

.HP-HOME-INTRO {
	position: relative;
	color: #fff;
	background: #414141;
	padding-top: 140px;
	border-bottom: 160px solid #fff;
}

.HP-HOME-INTRO h1::before {
	content: "";
	display: block;
	margin: 0 auto 0 0;
	width: 118px;
	height: 15px;
	background: #e7ab28;
}

.HP-HOME-INTRO .content h3 {color:#e7ab28; margin-bottom:5px; text-transform:none;}
.HP-HOME-INTRO .content p {margin-top:0; text-transform:none;}

.HP-HOME-INTRO .hp-image {
	position: static;
	background-color: #eee;
	margin: -95px 80px -160px 0;
}

.HP-HOME-INTRO .bike {
	position: absolute;
	top: 40px;
	right: -80px;
	width: 500px;
	background: url(/assets/images/projects/holland-park/holland-park-bike-up.png) no-repeat center;
	background-size: contain;
	max-width: 30%;
}

.HP-HOME-INTRO .bike::after {
	content: "";
	display: block;
	padding-bottom: 165%;
}

@media screen and (min-width: 901px) {
	.HP-HOME-INTRO h1 {line-height:100px;}
	.HP-HOME-INTRO h1 span {color:#414141;}
	.HP-HOME-INTRO h3 {font-size:32px; line-height: 36px;}
	.HP-HOME-INTRO .content {max-width:350px; margin-top:-15px;}
	.HP-HOME-INTRO .content p {line-height:26px;}
	.HP-HOME-INTRO .hp-frame {
		position: relative;
		overflow: visible;
		padding-top: 1px;
		padding-bottom: 1px;
	}
}

@media screen and (max-width: 1300px) {
	.HP-HOME-INTRO .hp-image {margin-right:40px;}
	.HP-HOME-INTRO .bike {display:none;}
}

@media screen and (max-width: 900px) {
	.HP-HOME-INTRO {padding-top:0px; border-bottom: 60px solid #fff;}
	.HP-HOME-INTRO .hp-image {margin:0 20px -60px 0;}
	.HP-HOME-INTRO h1::before {width:75px; height:5px; margin-bottom:10px;}
	.HP-HOME-INTRO .content {margin-top:-20px;}
}



/* HOME-POINTS */

.HP-HOME-POINTS .group {
	background: #D3D1D1;
	box-shadow: 0 160px 0 #D3D1D1, inset 0 160px #FFFFFF;
}

.HP-HOME-POINTS .group .hp-image {margin:0 0 0 80px;}
.HP-HOME-POINTS .hp-image {margin:0 80px 0 0;}

.HP-HOME-POINTS h2 {max-width: 350px;}
.HP-HOME-POINTS h2::before {
	content: "";
	display: block;
	margin: -23px auto 15px 0;
	width: 118px;
	height: 5px;
	background: #e7ab28;
}

@media screen and (max-width: 1300px) {
	.HP-HOME-POINTS .group .hp-image {margin-left:40px;}
	.HP-HOME-POINTS .hp-image {margin-right:40px;}
}

@media screen and (max-width: 900px) {
	.HP-HOME-POINTS .group {box-shadow: 0 60px 0 #D3D1D1, inset 0 60px #FFFFFF;}
	.HP-HOME-POINTS .group .hp-image {margin-left:20px;}
	.HP-HOME-POINTS .hp-image {margin-right:20px;}
	.HP-HOME-POINTS h2 {margin-bottom:-25px;}
	.HP-HOME-POINTS h2::before {width:75px; height:5px; margin-top:-10px; margin-bottom:10px;}
}



/* HP-HOME-LOCATIONS */

.HP-HOME-LOCATIONS .hp-image + p {
	font-size: 15px;
	margin-top: 10px;
}



/* HP-INTRO */

.HP-INTRO {
	padding-top: 40px;
}

.HP-INTRO h1::before {
	content: "";
	display: block;
	margin: -35px auto 15px 0;
	width: 118px;
	height: 15px;
	background: #e7ab28;
}

.HP-INTRO h3 {
	text-transform: none;
	max-width: 350px;
	color: #e7ab28;
	margin-top: 5px;
	letter-spacing: 0.05em;
}

.HP-INTRO h4 {
	margin-top: 5px;
}

.HP-INTRO ul {
	margin-top: -10px;
}

.HP-INTRO strong {
	font-weight: 400;
	color: #e7ab28;
}

.HP-INTRO a.button {
	display: inline-block;
	background: #e7ab28;
	line-height: 50px;
	height: 50px;
	color: #414141;
	text-transform: uppercase;
	padding: 0 30px;
	text-decoration: none;
	letter-spacing: 0.05em;
}

@media screen and (max-width: 900px) {
	.HP-INTRO {padding-top:25px;}
	.HP-INTRO .hp-column h1:last-child {margin-bottom:-25px;}
	.HP-INTRO h1::before {width:75px; height:5px; margin-top:-25px;}
	.HP-INTRO h3 {margin-top:0px;}
	.hp-body[data-page="contact"] .HP-INTRO .hp-image {margin:-15px auto -20px 0; max-width:200px;}
	.hp-body[data-page="floorplan"] .HP-INTRO .hp-column[data-width="1/3"]:nth-child(2) {padding-top:0;}
	.hp-body[data-page="register"] .HP-INTRO .hp-column[data-width="1/2"]:last-child {padding-top:0;}
}



/* HP-FLOORPLANS */

.HP-FLOORPLANS h2 {
	margin: 40px 0 -10px;
}

.HP-FLOORPLANS h2::before {
	content: "";
	display: block;
	margin: 0 auto 15px 0;
	width: 118px;
	height: 5px;
	background: #e7ab28;
}

.HP-FLOORPLANS .hp-column:first-child h2 {
	margin-top: 0 !important;
}

.HP-FLOORPLANS .hp-image {
	position: relative;
	background: #D3D1D1 no-repeat center;
	background-size: contain;
}

.HP-FLOORPLANS .hp-image .content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	font-size: 26px;
	line-height: 32px;
}

.HP-FLOORPLANS .hp-image .name {
	padding: 120px 0 30px;
	font-size: 120px;
	line-height: 120px;
}

.HP-FLOORPLANS .hp-image .flag {
	position: absolute;
	top: 0;
	right: 0;
	width: 150px;
	height: 150px;
	background: no-repeat center;
	background-size: cover;
}

.HP-FLOORPLANS .hp-image .link {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 1200px) {
	.HP-FLOORPLANS .hp-image .name {padding:75px 0 15px; font-size:80px; line-height:80px;}
	.HP-FLOORPLANS .hp-image .content {font-size:20px; line-height:28px;}
}

@media screen and (max-width: 900px) {
	.HP-FLOORPLANS h2 {margin-top:10px; margin-bottom:-25px;}
	.HP-FLOORPLANS h2::before {width:75px; height:5px; margin-bottom:10px;}
	.HP-FLOORPLANS .hp-image .name {padding:75px 0 15px; font-size:60px; line-height:80px;}
	.HP-FLOORPLANS .hp-image .flag {width:100px; height:100px;}
	.hp-body[data-page="floorplans"] .HP-INTRO .hp-column:nth-child(2) {padding-top:0;}
}



/* HP-FLOORPLAN */

.HP-FLOORPLAN h4 {
	margin-bottom: 20px;
}

.HP-FLOORPLAN img {
	max-width: 100%;
	height: auto;
}

@media screen and (max-width: 900px) {
	.HP-FLOORPLAN h4 {margin-bottom: 15px;}
}



/* HP-GALLERY */

.HP-GALLERY h2 {
	margin-bottom: 40px;
}

.HP-GALLERY h2::before {
	content: "";
	display: block;
	margin: 0 auto 15px 0;
	width: 118px;
	height: 5px;
	background: #e7ab28;
}

.HP-GALLERY .prev-arrow {left:0 !important;}
.HP-GALLERY .next-arrow {right:0 !important;}

@media screen and (max-width: 900px) {
	.HP-GALLERY h2 {margin-bottom:20px;}
	.HP-GALLERY h2::before {width:75px; height:5px; margin-bottom:10px;}
}



/* HP-SITE-PLAN */

.HP-SITE-PLAN {
	background: #D3D1D1;
}

.HP-SITE-PLAN .hp-frame {
	padding-bottom: 40px;
}

.HP-SITE-PLAN h2 {
	font-size: 65px;
	line-height: 75px;
}

.HP-SITE-PLAN h2::before {
	content: "";
	display: block;
	margin: -35px auto 15px 0;
	width: 118px;
	height: 15px;
	background: #e7ab28;
}

.HP-SITE-PLAN .map {
	overflow: hidden;
	background: #eee no-repeat center;
	background-size: cover;
	padding-bottom: 73.33%;
	position: relative;
}

.HP-SITE-PLAN .map input {
	display: none;
}

.HP-SITE-PLAN .map ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.HP-SITE-PLAN .map li {
	position: absolute;
	margin: -15px 0 0 -15px !important;
	padding: 0;
}

.HP-SITE-PLAN .map .hotspot,
.HP-SITE-PLAN .map .hotspot label {
	display: block;
	width: 30px;
	height: 30px;
	font-size: 14px;
	text-align: center;
	line-height: 30px;
	color: #414141;
	cursor: pointer;
}

.HP-SITE-PLAN .map .tooltip {
	position: absolute;
	display: none;
	background: #414141;
	z-index: 1;
}

.HP-SITE-PLAN .map .tooltip::before {
	content: "";
    display: block;
    z-index: -1;
    border: 0 solid transparent;
    border-width: 30px 15px;
    border-left-color: #414141;
    position: absolute;
}

.HP-SITE-PLAN .map .tooltip .reset {
	position: absolute;
	top: 0;
	right: 0;
	color: #fff;
	font-size: 14px;
}

.HP-SITE-PLAN .map .tooltip .reset::before {
	content: "x";
	display: block;
	position: relative;
	width: 30px;
	height: 30px;
	font-size: 30px;
	line-height: 30px;
	text-align: center;
	z-index: 2;
	cursor: pointer;
}

.HP-SITE-PLAN .map .tooltip .reset::after {
	content: "";
	display: block;
	position: absolute;
	top: -9999px;
	bottom: -9999px;
	left: -9999px;
	right: -9999px;
}

.HP-SITE-PLAN .map .tooltip .content {
	position: relative;
	padding: 20px;
	overflow: hidden;
	text-transform: uppercase;
	color: #fff;
	font-size: 20px;
	line-height: 25px;
	width: 280px;
}

.HP-SITE-PLAN .map .tooltip .content *::selection {
	background-color: transparent;
}

.HP-SITE-PLAN .map .tooltip .title {font-size:30px; line-height:30px; color:#FDB913;}
.HP-SITE-PLAN .map .tooltip .price {font-size:30px; line-height:40px; font-weight:700; padding:4px 0;}
.HP-SITE-PLAN .map .tooltip .status {color:#FDB913;}
.HP-SITE-PLAN .map .tooltip a {color:#FDB913; text-decoration:none;}
.HP-SITE-PLAN .map .tooltip a::after {
	content:"";
	display: inline-block;
	vertical-align: top;
	margin: 5px 0 0 7px;
	width: 0;
	height: 0;
	border: 8px solid transparent;
	border-left-color: #FDB913;
}

.HP-SITE-PLAN .map li[data-quadrant*=N] .tooltip {top:60px;}
.HP-SITE-PLAN .map li[data-quadrant*=N] .tooltip::before {top:-30px;}
.HP-SITE-PLAN .map li[data-quadrant*=E] .tooltip {right:15px;}
.HP-SITE-PLAN .map li[data-quadrant*=E] .tooltip::before {right:0; border-left-color:transparent; border-right-color:#414141;}
.HP-SITE-PLAN .map li[data-quadrant*=S] .tooltip {bottom:60px;}
.HP-SITE-PLAN .map li[data-quadrant*=S] .tooltip::before {bottom:-30px;}
.HP-SITE-PLAN .map li[data-quadrant*=W] .tooltip {left:15px;}
.HP-SITE-PLAN .map li[data-quadrant*=W] .tooltip::before {left:0;}

.HP-SITE-PLAN .map input:nth-child(1):checked ~ ul li:nth-child(1) .tooltip,
.HP-SITE-PLAN .map input:nth-child(2):checked ~ ul li:nth-child(2) .tooltip,
.HP-SITE-PLAN .map input:nth-child(3):checked ~ ul li:nth-child(3) .tooltip,
.HP-SITE-PLAN .map input:nth-child(4):checked ~ ul li:nth-child(4) .tooltip,
.HP-SITE-PLAN .map input:nth-child(5):checked ~ ul li:nth-child(5) .tooltip,
.HP-SITE-PLAN .map input:nth-child(6):checked ~ ul li:nth-child(6) .tooltip,
.HP-SITE-PLAN .map input:nth-child(7):checked ~ ul li:nth-child(7) .tooltip,
.HP-SITE-PLAN .map input:nth-child(8):checked ~ ul li:nth-child(8) .tooltip,
.HP-SITE-PLAN .map input:nth-child(9):checked ~ ul li:nth-child(9) .tooltip,
.HP-SITE-PLAN .map input:nth-child(10):checked ~ ul li:nth-child(10) .tooltip,
.HP-SITE-PLAN .map input:nth-child(11):checked ~ ul li:nth-child(11) .tooltip,
.HP-SITE-PLAN .map input:nth-child(12):checked ~ ul li:nth-child(12) .tooltip,
.HP-SITE-PLAN .map input:nth-child(13):checked ~ ul li:nth-child(13) .tooltip,
.HP-SITE-PLAN .map input:nth-child(14):checked ~ ul li:nth-child(14) .tooltip,
.HP-SITE-PLAN .map input:nth-child(15):checked ~ ul li:nth-child(15) .tooltip,
.HP-SITE-PLAN .map input:nth-child(16):checked ~ ul li:nth-child(16) .tooltip,
.HP-SITE-PLAN .map input:nth-child(17):checked ~ ul li:nth-child(17) .tooltip,
.HP-SITE-PLAN .map input:nth-child(18):checked ~ ul li:nth-child(18) .tooltip,
.HP-SITE-PLAN .map input:nth-child(19):checked ~ ul li:nth-child(19) .tooltip,
.HP-SITE-PLAN .map input:nth-child(20):checked ~ ul li:nth-child(20) .tooltip,
.HP-SITE-PLAN .map input:nth-child(21):checked ~ ul li:nth-child(21) .tooltip,
.HP-SITE-PLAN .map input:nth-child(22):checked ~ ul li:nth-child(22) .tooltip,
.HP-SITE-PLAN .map input:nth-child(23):checked ~ ul li:nth-child(23) .tooltip,
.HP-SITE-PLAN .map input:nth-child(24):checked ~ ul li:nth-child(24) .tooltip,
.HP-SITE-PLAN .map input:nth-child(25):checked ~ ul li:nth-child(25) .tooltip,
.HP-SITE-PLAN .map input:nth-child(26):checked ~ ul li:nth-child(26) .tooltip,
.HP-SITE-PLAN .map input:nth-child(27):checked ~ ul li:nth-child(27) .tooltip,
.HP-SITE-PLAN .map input:nth-child(28):checked ~ ul li:nth-child(28) .tooltip,
.HP-SITE-PLAN .map input:nth-child(29):checked ~ ul li:nth-child(29) .tooltip,
.HP-SITE-PLAN .map input:nth-child(30):checked ~ ul li:nth-child(30) .tooltip,
.HP-SITE-PLAN .map input:nth-child(31):checked ~ ul li:nth-child(31) .tooltip,
.HP-SITE-PLAN .map input:nth-child(32):checked ~ ul li:nth-child(32) .tooltip,
.HP-SITE-PLAN .map input:nth-child(33):checked ~ ul li:nth-child(33) .tooltip,
.HP-SITE-PLAN .map input:nth-child(34):checked ~ ul li:nth-child(34) .tooltip,
.HP-SITE-PLAN .map input:nth-child(35):checked ~ ul li:nth-child(35) .tooltip,
.HP-SITE-PLAN .map input:nth-child(36):checked ~ ul li:nth-child(36) .tooltip,
.HP-SITE-PLAN .map input:nth-child(37):checked ~ ul li:nth-child(37) .tooltip,
.HP-SITE-PLAN .map input:nth-child(38):checked ~ ul li:nth-child(38) .tooltip,
.HP-SITE-PLAN .map input:nth-child(39):checked ~ ul li:nth-child(39) .tooltip,
.HP-SITE-PLAN .map input:nth-child(40):checked ~ ul li:nth-child(40) .tooltip{
	display: block;
}

.HP-SITE-PLAN .map .hotspot .sold {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: red;
	color: #fff;
	cursor: default;
}

@media screen and (max-width: 900px) {
	.HP-SITE-PLAN .hp-frame {padding-bottom:20px;}
	.HP-SITE-PLAN h2 {font-size:40px; line-height:48px;}
	.HP-SITE-PLAN h2::before {width:75px; height:5px; margin-top:0; margin-bottom:10px;}
	.HP-SITE-PLAN .map .tooltip::before {display:none;}
	.HP-SITE-PLAN .map input:checked ~ ul li {position:static;}
	.HP-SITE-PLAN .map input:checked ~ ul li .hotspot {display:none;}
	.HP-SITE-PLAN .map .tooltip {top:50% !important; left:50% !important; bottom:auto !important; right:auto !important; transform:translate(-50%, -50%);}
	.HP-SITE-PLAN .map .tooltip .reset::after {background: #414141; opacity:0.75;}

	.HP-SITE-PLAN .map li {margin:-5px 0 0 -5px !important;}
	.HP-SITE-PLAN .map li .hotspot,
	.HP-SITE-PLAN .map li .hotspot label {width:10px; height:10px; font-size:0; background:#414141;}
	.HP-SITE-PLAN .map li .hotspot .sold {font-size:0; color:red;}

}


/* HP-DESIGN */

.HP-DESIGN h2::before {
	content: "";
	display: block;
	margin: 0 auto 15px 0;
	width: 118px;
	height: 5px;
	background: #e7ab28;
}

.HP-DESIGN .group + .group {
	margin-top: 80px;
}

.HP-DESIGN .hp-image {
	margin-top: 25px;
	box-shadow: 750px 0 0 #D3D1D1, -750px 0 0 #D3D1D1;
}

@media screen and (max-width: 900px) {
	.HP-DESIGN h2::before {width:75px; height:5px; margin-bottom:10px;}
	.HP-DESIGN .group + .group {margin-top:40px;}
	.HP-DESIGN .hp-image {margin-top:15px; box-shadow: 250px 0 0 #D3D1D1, -250px 0 0 #D3D1D1;}
}



/* HP-COMMUNITY */

.HP-COMMUNITY .hp-frame {
	padding-top: 0;
	padding-bottom: 25px;
}

.HP-COMMUNITY .hp-image::after {
	padding-bottom: 55%;
}

.HP-COMMUNITY .hp-image ol li > span:first-child {
	font-size: 0;
	color: #FDB913;
}

.HP-COMMUNITY h2::before {
	content: "";
	display: block;
	margin: 0 auto 15px 0;
	width: 118px;
	height: 5px;
	background: #e7ab28;
}

.HP-COMMUNITY .tabs > input {
	display: none;
}

.HP-COMMUNITY .views > ul,
.HP-COMMUNITY .labels > ul {
	list-style: none;
	padding: 0 40px;
	max-width: 1150px;
	margin: 0 auto;
}

.HP-COMMUNITY .views > ul > li,
.HP-COMMUNITY .labels > ul > li {
	padding: 0;
	margin: 0;
}

.HP-COMMUNITY .labels {
	background: #8D8989;
}

.HP-COMMUNITY .labels > ul {overflow:hidden;}
.HP-COMMUNITY .labels > ul > li {float:left; width:20%;}

.HP-COMMUNITY .labels label {
	display: block;
	color: #fff;
	text-align: center;
	padding: 20px 0;
	text-transform: uppercase;
}

.HP-COMMUNITY .views {padding-top:40px;}
.HP-COMMUNITY .views .content {display:none;}

.HP-COMMUNITY .content ul {
	margin: -7px -20px;
	overflow: hidden;
}

.HP-COMMUNITY .content li {
	float: left;
	width: 33.33%;
	position: relative;
	padding: 7px 20px 7px 60px;
	box-sizing: border-box;
}

.HP-COMMUNITY .content li::before {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	left: 20px;
	width: 25px;
	height: 25px;
	background: #FDB913;
	margin-top: -12px;
}

.HP-COMMUNITY input:nth-child(1):checked ~ .labels > ul > li:nth-child(1) label,
.HP-COMMUNITY input:nth-child(2):checked ~ .labels > ul > li:nth-child(2) label,
.HP-COMMUNITY input:nth-child(3):checked ~ .labels > ul > li:nth-child(3) label,
.HP-COMMUNITY input:nth-child(4):checked ~ .labels > ul > li:nth-child(4) label,
.HP-COMMUNITY input:nth-child(5):checked ~ .labels > ul > li:nth-child(5) label {background:#fff; color:#414141;}

.HP-COMMUNITY input:nth-child(1):checked ~ .views > ul > li:nth-child(1),
.HP-COMMUNITY input:nth-child(2):checked ~ .views > ul > li:nth-child(2),
.HP-COMMUNITY input:nth-child(3):checked ~ .views > ul > li:nth-child(3),
.HP-COMMUNITY input:nth-child(4):checked ~ .views > ul > li:nth-child(4),
.HP-COMMUNITY input:nth-child(5):checked ~ .views > ul > li:nth-child(5) {display:block;}

@media screen and (min-width: 1201px) {
	.HP-COMMUNITY .labels label {font-size:25px; line-height:30px;}
	.HP-COMMUNITY .content li {font-size:23px; line-height:28px;}
}

@media screen and (max-width: 900px) {
	.HP-COMMUNITY .hp-frame {padding-bottom:15px;}
	.HP-COMMUNITY h2::before {width:75px; height:5px; margin-bottom:10px;}
	.HP-COMMUNITY .views > ul,
	.HP-COMMUNITY .labels > ul {max-width:400px; padding:0 20px;}
	.HP-COMMUNITY .labels > ul > li {float:none; width:auto;}
	.HP-COMMUNITY .labels {padding:7px 0;}
	.HP-COMMUNITY .labels label {padding:5px 0; background:none !important; color:#fff !important; text-align:left; position:relative;}
	.HP-COMMUNITY .views {padding-top:20px;}
	.HP-COMMUNITY .content li {float:none; width:auto;}

	.HP-COMMUNITY input:nth-child(1):checked ~ .labels > ul > li:nth-child(1) label::before,
	.HP-COMMUNITY input:nth-child(2):checked ~ .labels > ul > li:nth-child(2) label::before,
	.HP-COMMUNITY input:nth-child(3):checked ~ .labels > ul > li:nth-child(3) label::before,
	.HP-COMMUNITY input:nth-child(4):checked ~ .labels > ul > li:nth-child(4) label::before,
	.HP-COMMUNITY input:nth-child(5):checked ~ .labels > ul > li:nth-child(5) label::before {
		content: "";
		display: block;
		position: absolute;
		top: 50%;
		left: -20px;
		width: 10px;
		height: 2px;
		background: #fff;
	}
}



/* HP-COMMUNITY-LIST */

.HP-COMMUNITY-LIST {
	overflow: hidden;
	margin-bottom: -40px;
}

.HP-COMMUNITY-LIST h2 {
	margin-bottom: -10px;
}

.HP-COMMUNITY-LIST h2::before {
	content: "";
	display: block;
	margin: 0 auto 15px 0;
	width: 118px;
	height: 5px;
	background: #e7ab28;
}

.HP-COMMUNITY-LIST .content {margin:20px 0 40px;}
.HP-COMMUNITY-LIST .content h4 {color:#e7ab28;}
.HP-COMMUNITY-LIST .content h4 + p {margin-top:10px;}

@media screen and (max-width: 900px) {
	.HP-COMMUNITY-LIST {margin-bottom:0;}
	.HP-COMMUNITY-LIST h2 {margin-bottom:-25px;}
	.HP-COMMUNITY-LIST h2::before {width:75px; height:5px; margin-bottom:10px;}
	.HP-COMMUNITY-LIST .content {margin-bottom:0;}
}



/* HP-CUSTOMER */

.HP-CUSTOMER h2::before {
	content: "";
	display: block;
	margin: 0 auto 15px 0;
	width: 118px;
	height: 5px;
	background: #e7ab28;
}

.HP-CUSTOMER ul {
	margin-top: -15px;
	padding-left: 25px;
	list-style: disc;
}

.hp-body[data-page="customer"] [data-fix="1"] {max-width:500px;}

@media screen and (max-width: 900px) {
	.HP-CUSTOMER h2::before {width:75px; height:5px; margin-bottom:10px;}
	.HP-CUSTOMER .hp-column:nth-child(2) {padding-top:0; padding-bottom:0;}
	.hp-body[data-page="customer"] [data-fix="1"] {padding-top:0;}
}



/* HP-FAQ */

.HP-FAQ > ul {
	margin: 0;
	padding: 0;
	border-top: 1px solid #414141;
}

.HP-FAQ > ul > li {
	position: relative;
	padding: 15px 0;
	border-bottom: 1px solid #414141;
}

.HP-FAQ > input {
	display: none;
}

.HP-FAQ .reset {
	display: none;
	position: absolute;
	top: 11px;
	right: 0;
	width: 40px;
	height: 40px;
	background: url(/assets/images/projects/holland-park/holland-park-arrow.svg) no-repeat center #fff;
	transform: rotate(90deg);
	z-index: 1;
}

.HP-FAQ .question {
	display: block;
	font-size: 26px;
	line-height: 32px;
	color: #e7ab28;
	text-transform: uppercase;
	padding-right: 40px;
}

.HP-FAQ .question::before {
	content: "";
	display: block;
	position: absolute;
	top: 11px;
	right: 0;
	width: 40px;
	height: 40px;
	background: url(/assets/images/projects/holland-park/holland-park-arrow.svg) no-repeat center #fff;
}

.HP-FAQ .answer {
	display: none;
	padding-top: 20px;
}

.HP-FAQ input:nth-child(1):checked ~ ul li:nth-child(1) .answer,
.HP-FAQ input:nth-child(2):checked ~ ul li:nth-child(2) .answer,
.HP-FAQ input:nth-child(3):checked ~ ul li:nth-child(3) .answer,
.HP-FAQ input:nth-child(4):checked ~ ul li:nth-child(4) .answer,
.HP-FAQ input:nth-child(5):checked ~ ul li:nth-child(5) .answer,
.HP-FAQ input:nth-child(6):checked ~ ul li:nth-child(6) .answer,
.HP-FAQ input:nth-child(7):checked ~ ul li:nth-child(7) .answer,
.HP-FAQ input:nth-child(8):checked ~ ul li:nth-child(8) .answer,
.HP-FAQ input:nth-child(9):checked ~ ul li:nth-child(9) .answer {display:block;}

.HP-FAQ input:nth-child(1):checked ~ ul li:nth-child(1) .reset,
.HP-FAQ input:nth-child(2):checked ~ ul li:nth-child(2) .reset,
.HP-FAQ input:nth-child(3):checked ~ ul li:nth-child(3) .reset,
.HP-FAQ input:nth-child(4):checked ~ ul li:nth-child(4) .reset,
.HP-FAQ input:nth-child(5):checked ~ ul li:nth-child(5) .reset,
.HP-FAQ input:nth-child(6):checked ~ ul li:nth-child(6) .reset,
.HP-FAQ input:nth-child(7):checked ~ ul li:nth-child(7) .reset,
.HP-FAQ input:nth-child(8):checked ~ ul li:nth-child(8) .reset,
.HP-FAQ input:nth-child(9):checked ~ ul li:nth-child(9) .reset {display:block;}



/* HUBSPOT FORM */

.hbspt-form {
	overflow: hidden;
	margin: -20px;
}

.hbspt-form .hs_firstname,
.hbspt-form .hs_lastname {
	float: left;
	width: 33.3%;
	box-sizing: border-box;
	padding: 20px;

}

.hbspt-form .hs_email {
	clear: left;
	float: left;
	width: 66.6%;
	box-sizing: border-box;
	padding: 30px 20px 20px;
}

.hbspt-form .hs_error_rollup {
	clear: left;
	box-sizing: border-box;
	padding: 40px 20px 20px;
	color: red;
}

.hbspt-form .hs-error-msgs {
	margin-top: 10px;
}

.hbspt-form .hs-error-msgs label {
	font-size: 16px;
	line-height: 20px;
	text-transform: none;
}

.hbspt-form .hs-error-msgs label a {
	color: #414141;
}

.hbspt-form .hs-fieldtype-booleancheckbox {
	float: right;
	width: 33.3%;
	box-sizing: border-box;
	padding: 20px;
	margin-top: -120px;
}

.hbspt-form .hs-fieldtype-booleancheckbox input {margin-right:5px;}
.hbspt-form .hs-fieldtype-booleancheckbox label {
	text-transform: none;
	font-size: 16px;
	line-height: 20px;
}

.hbspt-form .hs_submit {
	clear: right;
	float: right;
	width: 33.3%;
	box-sizing: border-box;
	padding: 20px;
}

.hbspt-form label {
	text-transform: uppercase;
	font-size: 30px;
	line-height: 30px;
}

.hbspt-form input[type="text"],
.hbspt-form input[type="email"] {
	border: none;
	border-bottom: 1px solid #414141;
	color: #414141;
	font-family: inherit;
	font-size: 20px;
	line-height: 40px;
	background: none;
	width: 100%;
	padding: 5px 0;
}

.hbspt-form input[type="submit"] {
	display: inline-block;
	background: #e7ab28;
	font-size: 20px;
	line-height: 45px;
	height: 50px;
	color: #414141;
	text-transform: uppercase;
	text-decoration: none;
	letter-spacing: 0.05em;
	font-family: inherit;
	border: none;
	width: 100%;
	text-align: center;
}

@media screen and (max-width: 900px) {
	.hbspt-form .hs_firstname,
	.hbspt-form .hs_lastname {float:none; width:auto;}
	.hbspt-form .hs_email {float:none; width:auto;}
	.hbspt-form .hs-fieldtype-booleancheckbox {float:none; width:auto; margin-top:0;}
	.hbspt-form .hs_submit {float:none; width:auto;}
}