@import url("/css/_normalize.min.css");
@import url("/css/_footer.css");
@import url("/css/landing/landing_btns.css");
/*@import url("/css/landing/logo.css");*/


footer.fixed {
	position: fixed;
	bottom: 0;
	width: 100%;
	z-index: 4;
}



/* ==========================================================================
common
========================================================================== */

.textHide {white-space: nowrap;text-indent: 200%;overflow: hidden;display: block;}

@media screen and (orientation:landscape) {
	@media screen and (max-width: 736px) {
		.container {			
			height: 420px;
		}
	}

}


.landing-btns {
	padding-top: 10px;
}
/* ==========================================================================
background
========================================================================== */


body { background: url('../images/ffo-background.jpg') center top #000 no-repeat; }



@media screen and (max-width: 850px) {
	body {
		background-size: 1152px 768px;
		background-position: center 0px;
	}
}

@media screen and (max-width: 520px) {
	body {
		background-size: 800px 533px;
		background-position: center 00px;
	}
}


@media screen and (max-width: 360px) {
	body {
		background-size: 700px 467px;
	}
}


@media screen and (orientation:landscape) {
	@media screen and (max-width: 800px) {
		body {
			background-size: 800px 533px;
			background-position: center 0px;
		}
	}
}


/* ==========================================================================
logo
========================================================================== */
.logo {
	width: 653px;
	height: 166px;
	position: absolute;
	left: 50%;
	margin-left: -327px;
	bottom: 15%;
}

.logo a {
	background-image: url("../images/ffo-logo.png");
	background-repeat: no-repeat;
	display: block;
	width: 100%;
	height: 100%;
}



@media screen and (max-width: 768px) {
	.logo {
		bottom: auto;
		top: 55%;
		width: 60%;
		margin-left: -30%;
		height: 0;
	}
	.logo a {
		background-size: cover;
		padding-top: 25.42%;
		height: 0;
	}
}




@media screen and (orientation:landscape) {
	@media screen and (max-width: 768px) {
		.logo {
			width: 50%;
			margin-left: -25%;
			top: auto;
			bottom: 42%;
		}
	}

	@media screen and (max-width: 736px) {
		.logo {
			bottom: auto;
			top: 80%;
		}
	}
	@media screen and (max-width: 568px) {
		.logo {
			bottom: auto;
			top: 90%;
		}
	}
}