@charset "UTF-8";
/* CSS Document */
body{
	color: #4d4d4d;
}
.project-hero{
		position: relative;
		height: calc(100vh - 100px);
		background-position: 50% 50%;
		background-size: cover;
		background-repeat: no-repeat;
	}
#video-background {
	position: absolute;
	background-attachment: 50% 50%;
	right: 0; 
	bottom: 0;
	min-width: 100%; 
	min-height: 100%;
	width: auto; 
	height: auto;
	z-index: -100;
}
	.hero-overlay{
		background-color: rgba(0,0,0,.35);
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.hero-box{
		width:calc( 100vw - 200px );
		height: calc( 100vh - 250px );
		margin: 100px auto;
		border: 2px solid rgba(186, 141, 11, .5);
		position: relative;
	}
	.hero-logo{
		background-color: transparent;
		padding-bottom:15px; 
		margin: 0 auto;
		margin-top: -7%;
	}
	.hero-text{
		width: 100%;
		margin-top: 75px;
		color: #FFF;
		
	}
	.hero-button{
		transform: translate(-50% 105%);
		 -ms-transform: translate(-50%, 105%);
    	 -webkit-transform: translate(-50%, 105%);
		 -moz-transform: translate(-50%, 105%);
		position: absolute;
		bottom: 5%;
		left:50%;
		
	}
	.btn-reserve-now{
		font-size:27px;
		letter-spacing: 1.5px;
		vertical-align: bottom;
		background-color: #a4a4a4;
	}

.project-hero h1{
	font-size: 51px;
	letter-spacing: 1.5px;
	line-height: 60px;
}
.welcome-text{
	margin-top: 75px;
	margin-bottom: 75px;
	font-weight: 300;
}

#registration{
	background-image: url(../images/bg-register.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: 150px;
	background-attachment: fixed;
}
#registration h2{
	margin-top: 50px;
	letter-spacing: 3.5px;
	margin-bottom: 25px;
}
#registration input{
	font-size: 15px;
	font-weight: 300;
}
#registration .btn-submit{
	padding: 8px 30px;
	font-size: 15px;
	background-color: #a4a4a4;
}
#registration textarea{
	border-radius: 0;
}
#registration select:not([multiple]){
    -webkit-appearance: none;
    -moz-appearance: none;
	border-radius: 0;
	font-size: 15px;
	font-weight: 300;
    background-position: right 50%;
    background-repeat: no-repeat;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAMCAYAAABSgIzaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZFNDEwNjlGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDZFNDEwNkFGNzFEMTFFMkJEQ0VDRTM1N0RCMzMyMkIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0NkU0MTA2N0Y3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0NkU0MTA2OEY3MUQxMUUyQkRDRUNFMzU3REIzMzIyQiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PuGsgwQAAAA5SURBVHjaYvz//z8DOYCJgUxAf42MQIzTk0D/M+KzkRGPoQSdykiKJrBGpOhgJFYTWNEIiEeAAAMAzNENEOH+do8AAAAASUVORK5CYII=);
    padding-right: 1.5em;
    color: #999;
}

 .form-control::-moz-placeholder,
.form-control::-moz-textarea-placeholder{
	color: #999;
  	opacity: 1;
	font-size: 15px;
	font-weight: 300;
}
.form-control:-ms-input-placeholder,
.form-control::-ms-textarea-placeholder{
	color: #999;
	font-size: 15px;
	font-weight: 300;
}
.form-control::-webkit-input-placeholder,
.form-control::-webkit-textarea-placeholder{
  	color: #999;
	font-size: 15px;
	font-weight: 300;
}

#footer{
	background: #000;
	padding:75px 15px; 
}
#footer p{
	font-size: 14px;
}
.social-icons{
	background-image: url(/images/icons/social-sprit.png);
	
}
.img-homes{
	padding-bottom: 30px;
}
.homes-wrapper {
	margin-top: 50px;
}
.homes-container a{
	text-align: center;
	color: #000;
}
.homes-container h2{
	margin-bottom: 1px;
	margin-top: -15px;
	color: #000;
}
.sq-ft{
	letter-spacing: 2.5px;
	
}
.home-features{
	font-size: 16px;
	margin-top: -10px;
	margin-bottom: 45px;
}
.hero-thank-you{
	background-image: url(../images/hero/hero-thank-you.jpg);
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: cover;
	height: 315px;
	position: relative;
}
.thank-you-heading{
	margin-top: 40px;
	line-height: 55px;
	font-size: 48px;
}
.thank-you-message{
	border: 1px solid #000;
	padding: 10px;
	max-width: 767px;
	margin: 0 auto;
	margin-top: 35px;
	margin-bottom: 35px;
}
.thank-you-text{
	line-height: 40px;
}
.btn-thank-you{
	margin-bottom: 50px;
	margin-top: 25px;
	background-color: #a4a4a4;
}

.floorplan-details{
	margin-top: 50px;
	margin-bottom: 50px;
}
.floorplan-navigation{
	margin-bottom: 50px;
	margin-top: 35px;
	padding-top: 15px;
	border-top: 1px solid #777;
}
.floorplan-navigation a{
	color: #000;
}
.btn-download,
.btn-elevation{
	width: 100%;
	max-width: 265px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 5px;
	margin-top: 5px;
	font-weight: 300;
	text-align: left;
	font-size: 16px;
	text-transform: uppercase;
	border: 1px solid #FFF;
	letter-spacing: .5px;
}
.elevation-buttons button:focus{
	color: #FFF!important;
}

.btn-download{
	background-color: #000;
	margin-bottom: 25px;
	margin-top: 50px;
	
}
.btn-download:hover{
	background-color: #ac7c0d;
	color: #FFF;
	
}

.btn-elevation:hover{
	background-color: #041457;
	color: #ac7c0d;
	border: 1px solid #ac7c0d;
}
.elevation-container{
	position: relative;
	min-height: 250px;
}
.elevation-buttons{
	margin-top: -11px;
}
.elevation-container img{
	position: absolute;
	top: 0;
	left: 0;
}
.img-elevation{
	transition: all .5s ease-in-out;
	margin-top: 60px;
}
.changeBg{
	background-color: #041457;
	color: #FFF;
}
.feature-images{
	

	margin-bottom: 50px;
}
 .img-features{
		 padding: 3px;
}

/* NAVIGATION */
	 
	 .menu-icon{
		 color: #FFF;
		 padding: 25px;
		 position: fixed;
		 top: 0;
		 right: 0;
		 z-index: 9998;
		 width: 165px;
    	height: 75px;
    	padding-left: 105px;
		 transition: all .5s ease-in-out; 
	 }
.move-me-up{
	margin-top: -16px!important;
}
	 .menu-icon p{	
		margin-left: -87px;
		font-size: 28px;
		transition: all .5s ease-in-out; 
	}

.menu-icon .icon-bar{
		 background-color: #FFF;
		 height: 4px;
		 border-radius: 5px;
		 width:32px;
		 margin-bottom: 4px;
	 }
	 .menu-icon:hover{
		 cursor: pointer;
	 }
	 .menu-icon-first{
		-ms-transform: rotate(45deg); /* IE 9 */
    	-webkit-transform: rotate(45deg); /* Safari */
    	transform: rotate(45deg);
		transition: all .5s ease-in-out; 
	}
	 .menu-icon-last{
		-ms-transform:  translate(0,-7px) rotate(-45deg); /* IE 9 */
    	-webkit-transform: translate(0,-7px) rotate(-45deg); /* Safari */
    	transform: translate(0,-7px) rotate(-45deg); 
		transition: all .5s ease-in-out; 
	 }
	 
	 #navigation{
		 position: fixed;
		 top: 0;
		 background-color: rgba(0,0,0,1);
		 height: 100%;
		 width: 300px;
		 z-index: 9997;
		transition: all .5s ease-in-out; 
	}
	 .nav{
		 /* right: -300px; */
		
	 }
	 .navigation-show-hide{
		 right: 0;
		 transition: all .5s ease-in-out; 
	}
	 #navigation .project-menu{
		margin-top: 150px;
	 }
	 #navigation .project-menu li{
		list-style: none;
		margin-left: -40px;
		border-bottom: 1px solid rgba(242,242,242,.05);
		padding: 15px 25px;
		color: #FFF;
		 font-size: 17px;
		letter-spacing: 1.75px;
	 }
	  #navigation .project-menu li:hover{
		  background-color: #a4a4a4;
		  color: #000;
	 }
	  #navigation .project-menu li a{
		   color: #fff;
		  letter-spacing: 1.5px;
	 }
	 .nav-active{
		 background: #a4a4a4;
		 color: #000!important;
	 }
	 #navigation .menu-social{
		 margin-left: 15px;
		 margin-top: 100px;
	 }

	 
	 @media (max-width: 767px){
		 #navigation .project-menu{margin-top: 76px;}
		 #navigation .menu-social{ margin-top: 20px;}
	 }
	 @media(max-height: 380px){
		  #navigation .project-menu{margin-top: 45px;}
		 #navigation .menu-social{ margin-top: -25px;}
		 #navigation .project-menu li{padding:5px; margin-bottom: 5px;}

}

/* ENDS */
/*Commercial Video */
	#commercial	{
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,.85);
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999;
	}
	.commercial-container{
		position:relative;
		width: 75%;
		margin: auto auto;
	}
	#commercial-container video{
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		
	}
	#hideCommercial{
		margin-right: 15px;
		font-size: 50px;
	}
	#hideCommercial:hover{
		cursor: pointer;
	}
/* ENDS HERE */

.btn-full-site{
	background-color: #F00;
	color: #FFF;
}
#siteplan-switch{
	margin-bottom: 15px;
	background-color: #CCC;
	color: #333;
}
#map-container{
	padding: 0;
	width: 100%;
	margin: 0;
}
#map{
	width: 100%;
	height: 600px;
	padding: 0;
	margin: 0;

}
.bg-black{
	background-color: #000;
}
.legend{
	max-width: 800px;
	margin: 0 auto;
	padding-top: 20px;
	color: #fff;
	text-align: center;
	font-size: 80%;
}
.legend-wrapper{
	float: left;
	width: 80px;
	background-color: #000;
}
.legend-wrapper img:hover,
.img-exterior:hover{
	cursor: pointer;
}
.img-exterior{
	margin-bottom: 30px;
}#contactUs a,
#contact a{
	color: #ac7c0d;
}
#contact a:hover{
	color: #000;
}
#contact-detail{
	margin-bottom: -75px;
}
#contact-detail a{
	color: #FFF;
}
#contact-detail a:hover{
	color: #ac7c0d;
}

@media (max-width: 767px){
	#footer p{text-align: center; margin:25px auto;}
	.project-hero{min-height: 315px;}
	.project-hero h1{font-size: 32px;line-height: 42px;}
	.hero-logo{margin-top: -70px;}
	.btn-reserve-now{font-size: 22px;}
	.h-36{font-size: 28px;}
	.elevation-container{margin: 0 auto;}
	.elevation-container img{left: 50%;  transform: translateX(-50%);}
	.elevation-container p, .elevation-container h1{text-align: center;}
	.elevation-buttons{max-width: 300px; margin: 0 auto;}
	.btn-download{margin-top: 1px;}
	.floorplan-navigation{margin-top: 175px;}
	.commercial-container{width: 95%;}
	.hero-thank-you{height: 215px;}

}
@media (max-width: 499px){
	.project-hero{height: calc(100vh - 60px);}
	.project-hero h1{font-size: 26px;line-height: 32px;}
	.hero-box{width:calc( 100vw - 100px );height: calc( 100vh - 200px ); margin: 70px auto;}
	.hero-logo{margin-top: -70px;}
	.hero-button{bottom: 9%;}
	.h-36{font-size: 24px;}
	.h-32{font-size: 20px;}
	.floorplan-navigation{margin-top: 75px;}
	#navigation .project-menu li{padding: 6px 25px; font-size: 15px; letter-spacing: 1.25px;}

}
@media (min-width: 1400px){
	.hero-logo{margin-top: -90px;}

}
@media (max-height: 400px){
	.hero-text{display: none;}
	

}
@media (min-width: 768px) and (max-width: 992px) {
	
	}

@media (min-width: 768px) and (max-width:992px) {
	.btn-elevation, .btn-download {font-size: 12px;}
	.img-elevation{margin-top: 150px;}
}
@media (min-width: 992px) and (max-width:1199px) {
	.img-elevation{margin-top: 120px;}
	.navbar-default .navbar-nav > li > a, .dropdown-menu > li > a{font-size: 12.5px;}
	.nav > li > a{padding: 5px;}
	.navbar-brand img{width: 150px; margin: auto;}
	.navbar-default .navbar-collapse{padding-top: 0px;}
	.navbar-brand{float: none;}
	.navbar-right {float: none!important; margin-right: auto; margin-left: auto; display: table;}
	.navbar-header{width: 100%; display: block; height: 55px;}
}
@media (min-width: 1200px) and (max-width:1299px) {
	.navbar-brand img{width: 170px; margin: auto;}
	.navbar-default .navbar-nav > li > a, .dropdown-menu > li > a{font-size: 12.5px;}
}
@media (min-width: 1300px) and (max-width:1699px) {
	.navbar-brand img{width: 170px; margin: auto;}
	.navbar-default .navbar-nav > li > a, .dropdown-menu > li > a{font-size: 12.5px;}
}