body {
	background-color: #add0c9;
	font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', sans-serif;
	color: #333;
	margin: 10px 50px;
}

a {
	color: #333;
}

a img {
	border: 0;
}

h1 {
	font-weight: normal;
	text-align: center;
	font-size: 5.5em;
	margin: 0;
	font-family: 'HelveticaNeue-UltraLight', 'Helvetica Neue Ultra Light', sans-serif;
	letter-spacing: 2px;
}

h2 {
	font-weight: normal;
	text-align: center;
	font-size: 2em;
	margin: 0;
	letter-spacing: 1px;
	width: 50%;
	margin-left: 25%;
}

h3 {
	font-weight: normal;
	text-align: center;
	font-size: 1.8em;
	letter-spacing: 1px;
	margin: 50px 100px 0;
	clear: both;
}

h3#ios-app {
	font-size: 2em;
	margin-bottom: 10px;
	width: 60%;
	margin-left: 20%;
}

h3#ios-app img {
	vertical-align: -20%;
}

h3#ios-app strong,
h3#webapp strong {
	font-weight: normal;
	font-family: 'HelveticaNeue', 'Helvetica Neue', sans-serif;
}

h3#webapp {
	font-size: 2em;
	margin-bottom: 50px;
	margin-top: 10px;
	width: 60%;
	margin-left: 20%;
}

.separator {
	margin: 30px 0 0;
	background-color: #fbfaf8;
	height: 20px;
	width: 100%;
	position: relative;
	clear: both;
}

.separator .left {
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 20px 0 0 20px;
	border-color: transparent transparent transparent #add0c9;
	float: left;
}

.separator .right {
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 30px 30px 0;
	border-color: transparent #add0c9 transparent transparent;
	float: right;
}

#bike {
	float: left;
	position: absolute;
	bottom: 0;
	left: 40px;
}

#tree1 {
	float: right;
	position: absolute;
	right: 100px;
	top: -80px;
	z-index: 2;
}

#tree2 {
	float: right;
	position: absolute;
	right: 130px;
	top: -150px;
	z-index: 1;
}

#tree3 {
	float: right;
	position: absolute;
	right: 0;
	top: -150px;
	z-index: 3;
}

.video {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 640px;
	height: 360px;
	margin-top:30px;
}

.screen-box {
	clear: both;
	float: left;
	text-align: center;
	margin: 60px 0;
	position: relative;
	width: 100%;
}

.screen-box > div {
	width: 700px;
	margin: 0;
	padding: 0;
	display: inline-block;
}

.screen-box .left > div {
	float: right;
}

.screen-box .right > div {
	float: left;
}

.screen-box .i5 {
	width: 221px;
	height: 429px;
	background-image: url('images/i5b.png');
	background-repeat: no-repeat;
	margin: 0 30px;
	padding-top: 78px;
	padding-left: 22px;
	position: relative;
	text-align: left;
}

#introduction .i5 {
	width: 307px;
	margin: 0;
}

#introduction .left .i5 {
	text-align: right;
	background-position: right top;
}

#introduction .right .i5 {
	text-align: left;
	background-position: left top;
}

#introduction .left .i5 img {
	margin-right: 20px;
}

#introduction a {
	text-decoration: none;
}

#black-line-1, #black-line-2 {
	background-color: #000;
	height: 1px;
	position: relative;
}

#black-line-1 {
	left: 10px;
	bottom: 213px;
	width: 140px;
}

#black-line-2 {
	left: 195px;
	bottom: 165px;
	width: 100px;
}

#go-details, #explore-details {
	font-size: 1.5em;
	width: 300px;
	position: relative;
	text-align: center;
}

#go-details p,
#explore-details p {
	margin: 0;
}

#go-details {
	vertical-align: top;
	margin-top: 35px;
}

#explore-details {
	vertical-align: top;
	margin-top: 85px;
}

p.emphasis {
	font-family: 'Helvetica Neue', sans-serif;
	font-weight: 500;
	font-size: 1.1em;
}

#go-explanation-1, #go-explanation-2,
#explore-explanation-1, #explore-explanation-2 {
	width: 330px;
	font-size: 1.2em;
	vertical-align: top;
	margin: 0 30px;
	text-align: justify;
}

#go-explanation-1, #go-explanation-2 {
	margin-top: 60px;
}

#explore-explanation-1, #explore-explanation-2 {
	margin-top: 80px;
}

#other-devices {
	margin-top: 50px;
}

.screen-box #s4 {
	width: 267px;
	height: 501px;
	background-image: url('images/s4b.png');
	background-repeat: no-repeat;
	margin: 0 30px;
	padding-top: 55px;
	padding-left: 14px;
	text-align: left;
	vertical-align: top;
}

.screen-box #i3 {
	width: 646px;
	height: 494px;
	background-image: url('images/i3b.png');
	background-repeat: no-repeat;
	margin: 0 30px;
	padding-top: 62px;
	padding-left: 73px;
	text-align: left;
	vertical-align: top;
}

.screen-box #mbp {
	width: 606px;
	height: 361px;
	background-image: url('images/mbp.png');
	background-repeat: no-repeat;
	margin: 0 30px;
	padding-top: 25px;
	padding-left: 113px;
	text-align: left;
}

#spacer {
	position: relative;
	width: 100%;
	height: 50px;
}

#discontinued-warning {
	height: 50px;
	position: fixed;
	top: 0px;
	right: 0px;
	background-color: rgb(255, 234, 118);
	color: rgb(160, 117, 1);
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 9999;
}