body {
	background-image:	url("../images/background.gif");
	background-size:	1470px 440px;
}
#page {
	width:				auto;
	max-width:			935px;
	padding-top:		65px;
	margin:				0 auto;
}
#content {
	display:			block;
	padding:			0 80px;
}

#title {
	background:			url("../images/deliveries-icon.png") no-repeat 0 0 / 88px 88px;
	width:				504px;
	margin:				0 auto;
}
h1 {
	background-position:98px 0;
	background-size:	406px 88px;
	width:				504px;
	height:				88px;
}
#title:lang(ja), h1:lang(ja) {
	width:				452px;
}

#quotes {
	width:				calc(50vw - 75px);
	max-width:			275px;
	height:				calc(30vw - 44px);
	max-height:			162px;
	margin:				35px 0 0 0;
}
#quotes a {
	background-image:	url("../images/quote-1.svg");
}

#copy {
	max-width:			none;
	padding:			20px 0;
	margin:				0 auto;
}

#ios-screen {
	background:			url("../images/ios-screen-en.png") 0 0 / 100% no-repeat;
	width:				477px;
	height:				531px;
	margin:				25px auto 10px auto;
}
#ios-screen:lang(de) {
	background-image:	url("../images/ios-screen-de.png");
}
#ios-screen:lang(ja) {
	background-image:	url("../images/ios-screen-ja.png");
}

#mac-screen {
	background:			url("../images/mac-screen-en.png") 0 0 / 100% no-repeat;
	width:				calc(50vw - 80px);
	max-width:			389px;
	height:				calc(39vw - 62px);
	max-height:			305px;
	margin:				565px -10px 10px 10px;
	float:				right;
}
#mac-screen:lang(de) {
	background-image:	url("../images/mac-screen-de.png");
}
#mac-screen:lang(ja) {
	background-image:	url("../images/mac-screen-ja.png");
}

#footer {
	max-width:			755px;
	margin:				0 auto;
	padding:			0 0 40px 0;
}

#badges {
	flex-direction:		row;
	justify-content:	space-between;
	width:				360px;
	margin:				20px 0 15px 0;
}
#badges .ios a {
	margin:				0;
}

#junecloud {
	margin:				20px 0 15px 0;
}
#junecloud a {
	background-position:0 4px;
	width:				280px;
	height:				49px;
}
#junecloud a:lang(ja) {
	background-position:0 7px;
	height:				54px;
}

@media only screen and (min-width: 820px) {

	#badges {
		float:				right;
	}
	#junecloud {
		float:				left;
	}

}

@media only screen and (min-width: 935px) {

	#page {
		width:				100%;
		max-width:			935px;
	}
	#content {
		padding:			576px 90px 0 90px;
	}

	#quotes {
		position:			absolute;
		top:				539px;
		left:				570px;
		margin:				0;
	}
	#copy {
		column-count:		2;
		column-gap:			35px;
		padding:			20px 0;
	}

	#ios-screen {
		position:			absolute;
		top:				159px;
		left:				53px;
	}
	#mac-screen {
		position:			absolute;
		top:				200px;
		right:				58px;
		width:				389px;
		height:				305px;
		margin:				0;
	}

	#footer {
		margin:				0 0;
	}

}

@media only screen and (-webkit-min-device-pixel-ratio:1.3), 
	only screen and (min-device-pixel-ratio:1.3), 
	only screen and (min-resolution:120dpi) {

	body {
		background-image:	url("../images/background@2x.gif");
	}

	#title {
		background-image:	url("../images/deliveries-icon@2x.png");
	}
	
	#ios-screen {
		background-image:	url("../images/ios-screen-en@2x.png");
	}
	#ios-screen:lang(de) {
		background-image:	url("../images/ios-screen-de@2x.png");
	}
	#ios-screen:lang(ja) {
		background-image:	url("../images/ios-screen-ja@2x.png");
	}

	#mac-screen {
		background-image:	url("../images/mac-screen-en@2x.png");
	}
	#mac-screen:lang(de) {
		background-image:	url("../images/mac-screen-de@2x.png");
	}
	#mac-screen:lang(ja) {
		background-image:	url("../images/mac-screen-ja@2x.png");
	}

}