body {
	background-image : url('../images/special.png');
	background-position : right bottom;
	background-repeat : no-repeat;
	background-attachment : fixed;
}

#topBanner {
	display : inline-block;
	width : 100%;
	position : relative;
	background-image : url('../images/mainbanner.jpg');
	background-position : center center;
	background-size : cover;
	background-repeat : no-repeat;
	padding : 4rem 1rem 1rem 1rem;
	/*min-height : 43rem;*/
}

#topBanner #logo {
	display : inline-block;
	width : 15em;
	height : 5em;
	
	background-image : url('../images/logo.png');
	background-position : center center;
	background-repeat : no-repeat;
	background-size : contain;
	
	z-index : 2;
}

/* MENU */

#mainNav {
	display : inline-block;
	width : 100%;
	position : fixed;
	top : 0em;
	left : 0em;
	padding : 0em;
	padding-left : 1rem;
	text-align : left;
	z-index : 999;
	background-color : #FBFBFB;
	transition : padding-left .5s ease;
}

#mainNav a {
	display : inline-block;
	font-size : 1.5rem;
	color : #aaa;
	font-family : 'Roboto Condensed', sans-serif;
	text-decoration : none;
	padding : .6rem 1rem; 
}

#mainNav a:hover {
	background-color : #fff;
	color : #ff8004;
}

#mainNav #phone {
	float : right;
	color : #FF8004;
	font-size : 2.5rem;
	padding : .1rem 1rem; 
}

#mainNav #menuLogo {
	display : inline-block;
	width : 9rem;
	background-image : url('../images/logo.png');
	background-position : center center;
	background-repeat : no-repeat;
	background-size : contain;
	position : absolute;
	left : -100%;
	top : .1rem;
	transition : left .5s ease;
}

#mainNav #menuLogo:hover {
	background-color : transparent;
}

#mainNav.scrolled {
	padding-left : 10rem;
}

#mainNav.scrolled #menuLogo {
	left : 0em;
}


/* blocks */

section>div>h2 {
    text-align: center;
    text-transform: uppercase;
    color: #5D5D5D;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 3em;
}

section>div>h2::after {
	display : block;
	content : '';
	width : 10%;
	margin : 0 auto;
	padding : 0;
	height : .3rem;
	background-color : #ccc;
}

section>div>h1 {
    text-align: center;
    text-transform: uppercase;
    color: #5D5D5D;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 3em;
}

section>div>h1::after {
	display : block;
	content : '';
	width : 10%;
	margin : 0 auto;
	padding : 0;
	height : .3rem;
	background-color : #ccc;
}

#content {
	padding-top : 5em;
	background-color : rgba(255,255,255,0.6);
}

#content a {
    display: block;
    width: 40%;
    max-width: 20em;
    background-color: #ff8004;
    margin: .5rem auto;
    padding: .2em;
    color: #fff;
    text-transform: uppercase;
    font-family: 'Roboto Condensed', sans-serif;
    text-align: center;
    font-size: 1.5em;
}

#content a:hover {
	background-color : #BD5E01;
}

@media (max-width: 1023px) {
	body {
		background : none;
	}
	
	#content {
		padding : 1em;
	}
	
	#logo {
		margin-top : 1em;
		display : block;
		height : 5em;
		background-image : url('../images/logo.png');
		background-repeat : no-repeat;
		background-size : contain;
		background-position : center center;
	}
}