header { position: fixed; top: 0;left: 0; z-index:2; width:100%; }

	.top-tier { display:none; }

	.header-container { 
		width:100%;padding:1.5em 0; background:#111; border-bottom:5px solid #000; background:#111;
		-webkit-transition: padding 0.5s ease-out;
		transition:padding 0.5s ease-out;
	}
		.header-outer { display:table; width:100%; }
			.header-inner { display:table-row; }			
				.header-left-nav { 
					color:#e8ca92; cursor:pointer; display:table-cell; width:20px; vertical-align:middle; background:#222; border-radius:0.25em; padding:0 0.25em; font-size:1.6em; 
					-webkit-transition: color 0.5s; /* For Safari 3.0 to 6.0 */
					transition: color 0.5s; /* For modern browsers */
				}
				
				.header-left-spacer { display:table-cell; width:1em; min-width:1em; }
				.header-left { 
					display:table-cell; width:auto; vertical-align:middle;
					-webkit-transition: width 0.5s; /* For Safari 3.0 to 6.0 */
					transition: width 0.5s; /* For modern browsers */				
				}				
					.header-left .logo { width:95%; }
				.header-right { display:none; }
					.nav { display:none; }
					
		header .table-cell { vertical-align:middle; }
		
		
		header .fa {
			-webkit-transition: all .5s ease-out;
			-moz-transition: all .5s ease-out;
			-o-transition: all .5s ease-out;
			transition: all .5s ease-out;			
		}
		header .rotate {
			-ms-transform: rotate(90deg); 
			-webkit-transform: rotate(90deg);
			transform: rotate(90deg);		
			-webkit-transition: all .25s ease-out;
			-moz-transition: all .25s ease-out;
			-o-transition: all .25s ease-out;
			transition: all .25s ease-out;		
		}

#left-nav-panel { 
	height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 1; /* Stay on top */
    top: 0;
    left: 0;
	text-align:left; font-size:1.1em; 
    background-color: #111; /* Black*/
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 20px; /* Place content 20px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */	
}
	.left-nav-container { color:#fff; margin-top:90px; padding:0 2em 0 0.5em; white-space:nowrap; }
	
		.left-nav, .left-nav:link, .left-nav:visited {
			display:block;
			padding:0.25em 0.5em;	
			color:#ccc !important;
			text-decoration:none;
			/*border-bottom:1px dotted #666;*/
			border-left:5px solid rgba(0,0,0,0);
			background: transparent;
			-webkit-transition: all .5s ease-out;
			-moz-transition: all .5s ease-out;
			-o-transition: all .5s ease-out;
			transition: all .5s ease-out;	
		}

		.left-nav-sub-container { font-size:0.8em; }
			.left-nav-sub-divider { width:100%;min-height:1px;max-height:1px;height:1px;border-bottom:1px dotted #444;margin:0.5em; }	
		
		.left-nav-blue:hover, .left-nav-blue:active { border-left:5px solid rgba(96,183,188,1); color:#fff !important;  }
		.left-nav-green:hover, .left-nav-green:active { border-left:5px solid rgba(117,137,89,1); color:#fff !important;  }
		.left-nav-orange:hover, .left-nav-orange:active { border-left:5px solid rgba(179,69,43,1); color:#fff !important;  }
		.left-nav-yellow:hover, .left-nav-yellow:active { border-left:5px solid rgba(234,168,45,1); color:#fff !important;  }
		.left-nav-gray:hover, .left-nav-gray:active { border-left:5px solid rgba(86,83,83,1); color:#fff !important; }

		.left-nav-divider { width:100%;min-height:1px;max-height:1px;height:1px;border-bottom:1px dotted #666;margin:0.5em; }	
	
.parallax{	
	position:relative;
	width: 100%;
	height: 100%;	
	min-height:560px;
	overflow:hidden;
	background-color:#0d2c43;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	background-position: center center;
	text-align:left;	
}	
	
	.parallax .parallax-title { border-left:10px solid #eba92d; padding-left:1em; }
	.parallax .parallax-title h2 { margin-top:0; }
	.parallax h1 { color:#fff;font-size:2em;text-align:left;margin-top:7%; text-shadow: 2px 2px 4px rgba(0,0,0,0.5); }
	.parallax p { font-family:'Fira Sans Condensed';color:#efefef;font-weight:400;padding:1em 0;text-align:left; width:100%; text-shadow: 2px 2px 4px rgba(0,0,0,0.5); font-size:1.3em; }	

	
.breadcrumb { padding:1em 0; }

@media all and (min-width: 600px) {	
	
	.header-left .logo { width:95%; }
		.header-left-nav { padding:0 0.5em; font-size:2em; }
		
	.header-right { display:none; }				
		.nav { display:none; }		
		
	
	.left-nav, .left-nav:link, .left-nav:visited { padding:0.5em; }
		
	.parallax { text-align:left; height: 50%; min-height: 500px; }							
		.parallax p { width:95%; font-size:1.4em; }	

	.breadcrumb { font-size:1.4em; }		
		
}
	
@media all and (min-width: 900px) {
	.header-left {  vertical-align:middle; }
		.header-left .logo { width:50%; }	
		.header-left-nav { padding:0.15em 0.25em; font-size:2em; }		
		
	.header-right { display:none; }
		.nav { display:none; }	
		
	
		.parallax p { width:75%; }	
			
}

@media all and (min-width: 1024px) {
	
	.top-tier { 
		display:block; width:100%; background:#efefef; padding:0.5em 0; font-size:0.8em; border-bottom:5px solid #000; 
		-webkit-transition: all .5s ease-out;
		-moz-transition: all .5s ease-out;
		-o-transition: all .5s ease-out;		
	}
	
		.top-tier a:link, .top-tier a:visited { color:#000; text-decoration:none; }
		.top-tier a:hover, .top-tier a:active { text-decoration:underline; }
		.top-tier span { float:right;color:#666; }
	
	.parallax h1 { font-size:2.5em; }
	
	.header-left-nav { display:none; }
	.header-left-spacer { display:none; }
	.header-left { width:40%; }
		.header-left .logo { width:100%; }
	.header-right { display:table-cell; vertical-align:middle; text-align:right; }		
		.nav { 
			display:inline-block; vertical-align: middle; padding:0.75em 0.25em; margin:0 0.25em; color:#ccc !important; text-decoration:none !important; font-size:0.9em; 
			background: transparent;
			-webkit-transform: perspective(1px) translateZ(0);			
			transform: perspective(1px) translateZ(0);
			box-shadow: 0 0 1px transparent;
			position: relative;
			overflow: hidden;
			-webkit-transition: color .3s ease-out;
			-moz-transition: color .3s ease-out;
			-o-transition: color .3s ease-out;
			transition: color .3s ease-out;			
		}		
			.nav-blue:before { 				
				content: "";
				position: absolute;
				z-index: -1;
				left: 50%;
				right: 50%;
				top: 0;
				background: rgba(96,183,188,1);
				height: 5px;
				-webkit-transition-property: left, right;
				transition-property: left, right;
				-webkit-transition-duration: 0.3s;
				transition-duration: 0.3s;
				-webkit-transition-timing-function: ease-out;
				transition-timing-function: ease-out;				
			}
			.nav-green:before { 								
				content: "";
				position: absolute;
				z-index: -1;
				left: 50%;
				right: 50%;
				top: 0;
				background: rgba(117,137,89,1);
				height: 5px;
				-webkit-transition-property: left, right;
				transition-property: left, right;
				-webkit-transition-duration: 0.3s;
				transition-duration: 0.3s;
				-webkit-transition-timing-function: ease-out;
				transition-timing-function: ease-out;					
			}
			.nav-orange:before { 							
				content: "";
				position: absolute;
				z-index: -1;
				left: 50%;
				right: 50%;
				top: 0;
				background: rgba(179,69,43,1);
				height: 5px;
				-webkit-transition-property: left, right;
				transition-property: left, right;
				-webkit-transition-duration: 0.3s;
				transition-duration: 0.3s;
				-webkit-transition-timing-function: ease-out;
				transition-timing-function: ease-out;				
			}
			.nav-yellow:before { 							
				content: "";
				position: absolute;
				z-index: -1;
				left: 50%;
				right: 50%;
				top: 0;
				background: rgba(234,168,45,1);
				height: 5px;
				-webkit-transition-property: left, right;
				transition-property: left, right;
				-webkit-transition-duration: 0.3s;
				transition-duration: 0.3s;
				-webkit-transition-timing-function: ease-out;
				transition-timing-function: ease-out;
			}
			.nav-gray:before { 							
				content: "";
				position: absolute;
				z-index: -1;
				left: 50%;
				right: 50%;
				top: 0;
				background: rgba(86,83,83,1);
				height: 5px;
				-webkit-transition-property: left, right;
				transition-property: left, right;
				-webkit-transition-duration: 0.3s;
				transition-duration: 0.3s;
				-webkit-transition-timing-function: ease-out;
				transition-timing-function: ease-out;			
			}

			.nav-blue:hover, .nav-green:hover, .nav-orange:hover, .nav-yellow:hover, .nav-gray:hover , .nav-blue-selected, .nav-green-selected, .nav-orange-selected, .nav-yellow-selected, .nav-gray-selected { color :#fff !important; }
			
			.nav-blue:hover:before, .nav-blue:focus:before, .nav-blue:active:before, .nav-blue-selected:before {
			  left: 0;
			  right: 0;
			  color:#fff !important;
			}			
			.nav-green:hover:before, .nav-green:focus:before, .nav-green:active:before, .nav-green-selected:before {
			  left: 0;
			  right: 0;
			  color:#fff !important;
			}			
			.nav-orange:hover:before, .nav-orange:focus:before, .nav-orange:active:before, .nav-orange-selected:before {
			  left: 0;
			  right: 0;
			  color:#fff !important;
			}			
			.nav-yellow:hover:before, .nav-yellow:focus:before, .nav-yellow:active:before, .nav-yellow-selected:before {
			  left: 0;
			  right: 0;
			  color:#fff !important;
			}			
			.nav-gray:hover:before, .nav-gray:focus:before, .nav-gray:active:before, .nav-gray-selected:before {
			  left: 0;
			  right: 0;
			  color:#fff !important;
			}						 

	.breadcrumb { font-size:1.1em; }		
			
	.shrink-top-tier {
		-webkit-transition: all .5s ease-out;
		-moz-transition: all .5s ease-out;
		-o-transition: all .5s ease-out;
		transition: all .5s ease-out;					
		height:0;
		padding:0;		
	}
	
		.shrink-top-tier .view-width { 
			-webkit-transition: all .5s ease-out;
			-moz-transition: all .5s ease-out;
			-o-transition: all .5s ease-out;
			transition: all .5s ease-out;					
			opacity:0;
		}
			
	.shrink-header { 
		padding:1em 0; 
		-webkit-transition: padding 0.5s ease-out;
		transition:padding 0.5s ease-out;		
	}
	.shrink-header .header-left {
		width:25%;
		-webkit-transition: padding 0.5s ease-out;
		transition:all 0.5s ease-out;
	}
		
	.parallax { min-height: 450px; }							

	.parallax p { width:90%; }	
	
}

@media all and (min-width: 1200px) {
	.header-left-nav { display:none; }
	.header-left-spacer { display:none; }
	.header-left { width:37%; }
		.header-left .logo { width:100%; }
	.header-right { display:table-cell; vertical-align:middle; text-align:right; }		
}

@media all and (min-width: 1280px) {
	.nav { font-size:1em; }
	.header-left { width:40%; }
}

@media all and (min-width:1400px) {
	.nav{ font-size:1.1em; }
	.parallax p { width:80%; }
}


/*
@mixin for-phone-only {
  @media (max-width: 599px) { @content; }
}
@mixin for-tablet-portrait-up {
  @media (min-width: 600px) { @content; }
}
@mixin for-tablet-landscape-up {
  @media (min-width: 900px) { @content; }
}
@mixin for-desktop-up {
  @media (min-width: 1200px) { @content; }
}
@mixin for-big-desktop-up {
  @media (min-width: 1800px) { @content; }
}
*/