@charset "utf-8";
/* CSS Document */
body{	margin: 0;	min-width: 980px;	padding: 0;}
p{	margin: 0 0 20px 0;	}
p, ul{	font-family:"Proxima Nova Light", 'Helvetica Neue', Arial, Helvetica, sans-serif;	font-size-adjust:0.488;	font-weight:200;	font-style:normal; color:#000000;}
img{	border: 0;}
h1, #pixels{	font-family:"Museo 900", Verdana, serif;	font-size-adjust:0.40;	font-weight:700;	font-style:normal;}
h2{	font-family:"Beau Sans Pro Book", Verdana, sans-serif;	font-size-adjust:0.531;	font-weight:500;	font-style:normal; color:#000000;}
#header h1, #pixels{	color: #48941A;}
.float-left{	float: left;		margin: 0 0 0 20px;}
.float-right{	float: right;	margin: 0 20px 0 0;}
.center{	font-size: 2.5em;	padding: 80px 0;	text-align: center;}
#nav{	list-style: none;	position: fixed;	right: 20px;z-index:1000;}
#nav li{	margin: 0 0 15px 0;}
#nav li a{	font-size:14; text-decoration: none;font-weight:bold;	font-style:normal; color:#000000;}
#header, #intro, #second{	width: 100%;}
#header{	background: white;	height: 130px;	}

#header{background:url(images/nav.png) top center no-repeat; height:96px;width:100%;margin:0 auto;position:fixed;top:0px!important;z-index:9999;}
#intro{	background:url(images/olo-screen1.jpg) 50% 0 no-repeat fixed;	color: white;	height: 1000px;	margin: 0;}


#second{	background: url(images/olo-screen2.jpg) 50% 0 no-repeat scroll;	color: white;	height: 1200px;	margin: 0 auto;	overflow: hidden;	padding: 0;}
#second .p1{background: url(images/olo-iphone.png) 50% 0 no-repeat scroll;	height: 1200px;	margin: 0 auto;	padding: 0;	position: absolute;	width: 100%;	z-index: 200;}
#second .sun{background: url(images/sun.png) no-repeat scroll;height: 300px;width:300px;	float:left;right:0px;	position: absolute;	z-index: 0;}
#second .car{background: url("images/tyre-shadow.png") no-repeat scroll 0 357px transparent;height:  691px;width:746px;	float:left;right:718px;top:460px;	position: absolute;	z-index: 210;}
#second .car img{margin-right: auto;margin-left: auto;display: block;height:1100px;width:1200px;opacity:1;}
#second .iphone-back{	height: 1200px;	margin: 0 auto;	padding: 0;	position: absolute;	width: 100%;	z-index: 200;}
#third{	background: url(images/olo-screen3.jpg) 50% 0 no-repeat scroll;	color: white;	height: 1200px;	padding: 0 0 0 0;overflow: hidden;	}
#third .p1{background: url(images/protection1.png) 50% 0 no-repeat scroll;	height: 1300px;	margin: 0 auto;	padding: 0;	position: absolute;	width: 100%;	z-index: 210;}
#third .protection2{background: url(images/protection2.png) 50% 0 no-repeat scroll;	height: 1200px;	margin: 0 auto;	padding: 0;	position: absolute;	width: 100%;	z-index: 200;}
#fourth{	background: url(images/olo-screen4.jpg) 50% 0 no-repeat scroll;	color: white;	height: 1200px;	padding: 0 0 0 0;	overflow: hidden;}
#fourth .p1{background: url(images/tablet-cover.png) 50% 0 no-repeat scroll;	height: 1200px;	margin: 0 auto;	padding: 0;	position: absolute;	width: 100%;	z-index: 200;}
#fourth .tablet{background: url(images/tablet.png) 50% 0 no-repeat scroll;	height: 1200px;	margin: 0 auto;	padding: 0;	position: absolute;	width: 100%;	z-index: 200;}
#fifth{	background: url(images/olo-screen5.jpg) 50% 0 no-repeat scroll;	color: white;	height: 1200px;	padding: 0 0 0 0;	overflow: hidden;}
#fifth .p1{background: url(images/screen-p4.png) 50% 0 no-repeat scroll;	height: 1200px;	margin: 0 auto;	padding: 0;	position: absolute;	width: 100%;	z-index: 200;}
#sixth{	background: url(images/olo-screen6.jpg) 50% 0 no-repeat scroll;	color: white;	height: 1350px;	padding: 0 0 0 0;	overflow: hidden;}



.story{	margin: 0 auto;	min-width: 980px;	width: 980px;	position:relative; background:url(images/olo-intro2.png) no-repeat top center;}
.story2{	margin: 0 auto;	min-width: 980px;	width: 980px;	position:relative; background:url(images/olo-intro3.png) no-repeat top center;}
.story .float-left, .story .float-right{	padding: 100px 0 0 0;position: relative;	width: 350px;	}
.intro-text{position:absolute;z-index:300;width:700px;top:732px;width:100%;background:url(images/olo-intro.png) repeat-x;height:270px;float:left;}
.second-text{position:absolute;z-index:300;width:700px;bottom:0px;width:100%;background:url(images/olo-intro.png) repeat-x;height:270px;float:left;}
.third-text{position:absolute;z-index:300;width:700px;bottom:0px;width:100%;background:url(images/olo-intro.png) repeat-x;height:270px;float:left;}
.fourth-text{position:absolute;z-index:300;width:700px;bottom:0px;width:100%;background:url(images/olo-intro.png) repeat-x;height:270px;float:left;}
.fifth-text{position:absolute;z-index:300;width:700px;bottom:0px;width:100%;background:url(images/olo-intro.png) repeat-x;height:270px;float:left;}

.width-1600{width:1600px;margin:0 auto;overflow:hidden;height:1200px;}
.map{position:absolute;z-index:300;width:1600px;top:7050px;width:100%;background:url(images/olo-intro.jpg) repeat-x;height:270px;float:left;}

/*-------------------------------------------------------------------    All Sprites here  -----------------------------------------------------------------------------*/
.s1-sprite1{height: 200px;margin: 0 auto;padding: 0;position: relative;width: 156px;z-index: 200;/*background:url(images/olo-screen-sprite1.png) no-repeat 80% 0;*/float:left;}
.s1-sprite2{height: 200px;margin: 0 auto;padding: 0;position: relative;width: 170px;z-index: 200;/*background:url(images/olo-screen-sprite2.png) no-repeat 78% 0;*/float:left;}
.s1-sprite3{height: 200px;margin: 0 auto;padding: 0;position: relative;width: 154px;z-index: 200;/*background:url(images/olo-screen-sprite3.png) no-repeat 76% 0;*/float:left;}


.s2-sprite1{height: 1200px;margin: 0 auto;padding: 0;position: absolute;width: 100%;z-index: 200;background:url(images/olo-screen2-sprite1.png) no-repeat 25% 0;}
.s2-sprite4{height: 1200px;margin: 0 auto;padding: 0;position: absolute;width: 100%;z-index: 200;background:url(images/olo-screen2-sprite4.png) no-repeat 25% 0;display:none;}

.s3-sprite1{height: 1200px;margin: 0 auto;padding: 0;position: absolute;width: 100%;z-index: 200;background:url(images/olo-screen3-sprite1.png) no-repeat 25% 0;}
.s3-sprite4{height: 1200px;margin: 0 auto;padding: 0;position: absolute;width: 100%;z-index: 200;background:url(images/olo-screen3-sprite4.png) no-repeat 25% 0;}

.circles{width:800px;height:500px;float:left;margin-top:450px;}

#next{width:41px;height:40px;float:left;background:url(images/next.png);position:absolute;top:455px;right:295px;z-index:0;}
#prev{width:41px;height:40px;float:left;background:url(images/prev.png);position:absolute;top:455px;right:479px;z-index:0;}

#iphone-back > img {    float: left;    position: absolute;    right: 120px;}