/* Table of Content
==================================================
	#Site Styles
	#UIKit Styles
	#Page Styles
	#Media Queries
	#Font-Face */
	


/* #Site Styles
================================================== */

.header .uk-container-alt {
    position: relative;
}

.featured-menu {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin: 0 !important;
}


/* #UIKit Styles
================================================== */

.uk-badge { background:var(--secondary); border-radius:0; font-size:0.725em; font-weight:600; text-transform:uppercase; padding:5px 10px; line-height:1em; }
	.uk-badge.sold { background:#b2181c; }

/* #Page Styles
================================================== */

.elevations {}
	.elevations .nav a { display:inline-block; padding:0 10px; margin:0 5px; }
	.elevations .nav a:hover { background:#f2f2f2; color:var(--dark); text-decoration:none; }
	.elevations .nav .uk-active a, .elevations .nav .uk-active a:hover { background:var(--primary); color:var(--white); }


.hero { position:relative; }
	.hero canvas { min-height:500px; }
	.hero:after { content:''; position:absolute; bottom:0; left:0; height:100%; width:100%; background: rgb(0,0,0); background: linear-gradient(0deg, rgba(0,0,0,0.835171568627451) 0%, rgba(0,0,0,0) 40%); }

.comm-nav a { text-transform:uppercase; color:var(--primary); font-weight:600; letter-spacing:1px; font-size:1.2em; display:inline-block; padding:10px; }

.pull-nav { margin-top:-75px; position:relative; z-index:2; }

.responsive-embed { 
	position: relative; 
	padding-bottom: 56.25%; /* 16:9 aspect ratio */
	height: 0;
	overflow: hidden;
	max-width: 100%;
} 
.responsive-embed iframe,
.responsive-embed object,
.responsive-embed embed { 
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.full-width { max-width: 100%; }

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		
		.hero .font15 { font-size:1.25em; }
		.hero .s4 { letter-spacing:2px; }
		
		.comm-nav li { margin-top:0 !important; padding-left:5px; text-align:center; }
		.comm-nav a { font-size:10px; letter-spacing:0; padding:5px; }
		
		.pull-nav { margin-top:-50px; position:relative; z-index:2; }
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */
		

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/