/* header */
#header {
	display: block;
	float: left;
	width: 100%;
}

	/* logo */
	.logo { max-height: 109px; display: block; }
	.logo img { width: 100%; height: auto; max-height: 64px; padding: 23px 0px; }

	/* mobile button */
	.mobile-button-wrapper {
		width: 100%;
		height: 71px;
		background-color: #ad1917;
		padding-top: 24px;
		float: left;
		text-align: center;
		cursor: pointer;
		position: relative;
		right: 0px;
		transition: right 0.4s 0s linear;
		-webkit-transition: right 0.4s 0s linear;	
		z-index: 100;	
	}
	.mobile-button-wrapper:before { font-size: 40px; color: #FFFFFF; content: '\f0c9'; }
	.mobile-button-wrapper.open:before {
		content: "\f00d";
		position: absolute;
		right: 30px;
	}

	/* top menu */
	.top-menu { display: none; }

		/* media specific styles */
		@media(min-width: 768px){
			/* logo */
			.logo { float: left; padding-left: 7px; }
			.logo img { max-height: 87px; float: left; padding: 18px 0px; width: 300px; }
			
			/* mobile button */
			.mobile-button-wrapper {
				float: right;
				height: 87px;
				width: 87px;
				background-color: #d10606;
				padding-top: 30px;
				margin-top: 10px;
				margin-right: 10px;
				box-shadow: 0px 0px 3px rgba(0, 0, 0, .25);
				border-radius: 3px;
				-webkit-border-radius: 3px;
				-moz-border-radius: 3px;
			}
		}
		@media(min-width: 1024px){

			#header {
				position: relative;
				z-index: 2;
			}

			/* mobile button */
			.mobile-button-wrapper { display: none; }

			/* top menu */
			.top-menu { display: block; }
		}
		@media(min-width: 1280px){
			#header {
				width: 100%;
				max-width: 1120px;
				margin: 0 auto;
				float: none;
				display: table;
			}
		}