@charset "utf-8";
/* CSS Document */

header {
	position: absolute;
	display: none;
}

main {
	padding: 20px 20px 20px 20px;
}

/* -------------------------------------------------------------------------------------------------------------------- */
/* FONTS																												*/


/* -------------------------------------------------------------------------------------------------------------------- */
/* GENERAL																												*/

#mcdonalds-app {
	font-family: Helvetica, Arial, sans-serif;
}

#mcdonalds-app h1 {
	color: #ffffff;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: 600;
}

#mcdonalds-app h2 {
	color: #f2d230;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: 600;
}

#mcdonalds-app h2 .number {
	position: relative;
	z-index: -1;
	display: block;
	color: rgba(0, 0, 0, 0.1);
	font-size: 4.0em;
	line-height: 1em;

	display: none;
}

#mcdonalds-app h3 {
	font-family: Helvetica, Arial, sans-serif;
	font-weight: 600;
}

#mcdonalds-app h4 {
	margin: 0 0 5px 0;
	color: #4c6699;
	font-size: 1.0em;
	line-height: 1.2em;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: 400;
	text-transform: uppercase;
}

/* -------------------------------------------------------------------------------------------------------------------- */
/* HERO																													*/

#mcdonalds-app #hero {
	background: #1a1a1a;
	background: -moz-linear-gradient(left, #1a1a1a 0%, #262626 50%, #1a1a1a 100%);
	background: -webkit-linear-gradient(left, #1a1a1a 0%,#262626 50%,#1a1a1a 100%);
	background: linear-gradient(to right, #1a1a1a 0%,#262626 50%,#1a1a1a 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a1a1a', endColorstr='#1a1a1a',GradientType=1 );
	padding-bottom: 0;
	position: relative;
	color: #ffffff;
}

#mcdonalds-app .project-title {
	color: #f2d230;
}

#mcdonalds-app #hero .img-intro {
	width: 139.9193%;
	margin: 0 0 -40px 0;
	float: left;
}

/* ---------------------------------------------------------------------------- */
/* HERO - FIELDS																*/

#mcdonalds-app .hero-info-fields {
	opacity: 0.2;
	color: #ffffff;
}

/* ---------------------------------------------------------------------------- */
/* HERO - YEAR																	*/

#mcdonalds-app .hero-info-year {
	opacity: 0.2;
	color: #ffffff;
}

/* ---------------------------------------------------------------------------- */
/* HERO - LOGO																	*/

#mcdonalds-app .hero-info-logo {
	opacity: 0.2;
}

/* -------------------------------------------------------------------------------------------------------------------- */
/* INTRO																												*/

#mcdonalds-app #intro {
	padding: 140px 0 140px 0;
}

/* -------------------------------------------------------------------------------------------------------------------- */
/* ORDER																												*/

#mcdonalds-app #order {
	background: #262626;
	color: #ffffff;
}

#mcdonalds-app #order .img-productoverview {
	max-width: 100%;
	border-radius: 8px;
	box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
	margin-top: -160px;
}

#mcdonalds-app #order .img-product {
	max-width: 100%;
	border-radius: 8px;
	box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
	margin-bottom: -160px;
}

/* -------------------------------------------------------------------------------------------------------------------- */
/* LOCATION																												*/

#mcdonalds-app #location {
	padding: 300px 0 300px 0;
}

/* -------------------------------------------------------------------------------------------------------------------- */
/* PAYMENT																												*/

#mcdonalds-app #payment {
	background: #262626;
	color: #ffffff;
}

#mcdonalds-app #payment .img-payment {
	max-width: 100%;
	border-radius: 8px;
	box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
	margin: -160px 0 0 0;
}

#mcdonalds-app #payment .img-confirmation {
	max-width: 100%;
	margin: 0 0 -200px 0;
}

/* -------------------------------------------------------------------------------------------------------------------- */
/* THANKS																												*/

#mcdonalds-app #thanks {
	padding-top: 160px;
}

#mcdonalds-app #thanks .thanks img {
	border-radius: 25%;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

@media only screen and (max-width: 1024px) {	
	
}

@media only screen and (max-width: 768px) {
	/* ---------------------------------------------------------------------------------------------------------------- */
	/* GENERAL																											*/

	#mcdonalds-app {
		font-size: 12px;
		line-height: 18px;
	}

	/* ---------------------------------------------------------------------------------------------------------------- */
	/* HERO																												*/

	#mcdonalds-app #hero {
		
	}

	/* ------------------------------------------------------------------------ */
	/* HERO - FIELDS															*/

	#mcdonalds-app #hero .fields {
		display: none;
	}

	/* ------------------------------------------------------------------------ */
	/* HERO - YEAR																*/

	#mcdonalds-app #hero .year {
		display: none;
	}

	/* ------------------------------------------------------------------------ */
	/* HERO - LOGO																*/

	#mcdonalds-app #hero .logo {
		display: none;
	}

	/* ---------------------------------------------------------------------------------------------------------------- */
	/* INTRO																											*/

	#mcdonalds-app #intro {
		padding: 40px 0 40px 0;
	}

	/* ---------------------------------------------------------------------------------------------------------------- */
	/* ORDER																											*/

	#mcdonalds-app #order {
		padding: 40px 0 0 0;
	}

	#mcdonalds-app #order .img-productoverview {
		border-radius: 4px;
		margin: 0;
	}
	
	#mcdonalds-app #order .img-product {
		border-radius: 4px;
		margin: 60px 0 -20px 0;
	}

	/* ---------------------------------------------------------------------------------------------------------------- */
	/* LOCATION																											*/

	#mcdonalds-app #location {
		padding: 40px 0 40px 0;
	}

	/* ---------------------------------------------------------------------------------------------------------------- */
	/* PAYMENT																											*/

	#mcdonalds-app #payment {
		padding: 40px 0 40px 0;
	}

	#mcdonalds-app #payment .img-payment {
		border-radius: 4px;
		margin: 0px 0 0 0;
	}
	
	#mcdonalds-app #payment .img-confirmation {
		max-width: 100%;
		margin: 0 0 -140px 0;
	}

	/* -------------------------------------------------------------------------------------------------------------------- */
	/* THANKS																												*/

	#mcdonalds-app #thanks {
		padding: 40px 0 40px 0;
	}

	#mcdonalds-app #thanks img {
		width: 40px;
		margin: 0 auto 5px auto;
	}
}

@media only screen and (max-width: 480px) {
	
}

@media  only screen and (-webkit-min-device-pixel-ratio: 1.5),
		only screen and (-moz-min-device-pixel-ratio: 1.5),
		only screen and (-o-min-device-pixel-ratio: 3/2),
		only screen and (min-device-pixel-ratio: 1.5),
		only screen and (min-resolution: 192dpi),
		only screen and (min-resolution: 1.5dppx)
{
	
}