body{
	margin:0;
	padding:0;
}
.starter{
	top: 0;
	left: 0;
	position: absolute;
	width:320px;
	max-width: 320px;
	max-height: 480px;
    height: 480px;
	background: url("images/firstImage.jpg") no-repeat;
	margin: 0;
	background-repeat: no-repeat;
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;

}
.experiance{
	position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
/* margin: 53% auto; */
padding: 0;
align-self: center;
}

.secondpage{
	display: none;
	top: 0;
	left: 0;
	position: absolute;
	width:320px;
	max-width: 320px;
	max-height: 480px;
    height: 480px;
	background: url("images/secondpage.jpg");
	background-repeat: no-repeat;
    background-size: 100% 100%;
	margin: 0;
    flex-direction: column;

}



.page4{
	display: none;
	top: 0;
	left: 0;
	position: absolute;
	width:320px;
	max-width: 320px;
	max-height: 480px;
    height: 480px;
	background-repeat: no-repeat;
    background-size: 100% 100%;
	margin: 0;
    flex-direction: column;

}

.page5{
	display: none;
	top: 0;
	left: 0;
	position: absolute;
	width:320px;
	max-width: 320px;
	max-height: 480px;
    height: 480px;
	background: url("images/page5.jpg");
	background-repeat: no-repeat;
    background-size: 100% 100%;
	margin: 0;
    flex-direction: column;

}
.exltr{
	position: absolute;
	right:0;
	bottom: 0;
	height: 200px;
	width:100px;
}

.seconds{
	position: absolute;
	right:130px;
	bottom: 105px;
	width:70px;
	height: 50px;
}

.ms{
	position: absolute;
	        top: 47px;
    left: 217px;
	font-size: 32px;
	color:white;
}

.meter{
	display: flex;
	flex-direction: column;
	position: absolute;
    width: 145px;
    height: 102px;
    left: 15px;
    top: 20px;
	background: url("images/meter.jpg");
	background-repeat: no-repeat;
    background-size: 100% 100%;
    justify-content: flex-end;
}

.needle{
	position: relative;;
	align-self: center;
	height: 62px;
	transform:rotate(-102deg);
	transform-origin:bottom;
	margin-bottom: 28px;
}

.numberImage{
	font-family: Verdana;
position: absolute;
top: 62%;
align-self: center;
font-size: 70px;
color: white;
font-family: Verdana;

font-style: italic;
}
.numberImageGo{
	display: none;
	position: absolute;
	top:21%;
	align-self: center;
}
img[src*="go"] {
    top:31%;
}

.thirdpage{
	display: none;
	flex-direction: column;
	top: 0;
	left: 0;
	position: absolute;
	width:100%;
	max-width: 320px;
	max-height: 480px;
    height: 100%;
	/*background: url("images/thirdpage.jpg");
	background-repeat: no-repeat;
    background-size: 100% 100%;*/
	margin: 0;
    flex-direction: column;

}

.dashboard{
	width:320px;
	height: 345px;
	position: relative;
	overflow: hidden;
}

.fulldash{
	position: absolute;
	left:0;
	top: 0;
	z-index: 60;
}

.lower{
	width:100%;
	background: url("images/red-bg.png");
	background-repeat: no-repeat;
    background-size: 100% 100%;
    height: 135px;
    overflow: hidden;
    position: relative;
}

.needleAnimation{
	-webkit-animation:move 4s;
    transform:rotate(0deg);
    transform-origin:bottom;
}
.road{
	height: 255px;
	width: 320px;
	position: absolute;
	bottom: 0;
}

.sky{
	position: absolute;
	z-index: 200;
	overflow: hidden;
	height: 91px;
	width:320px;
	background: url("images/sky.png");
	background-repeat: no-repeat;
    background-size: 100% 100%;

}

.mountains{
	position: absolute;
    height: 40px;
    width: 588px;
    top: 52px;
    left: -129px;
    background-position: center center;
}

.clouds{
	position: absolute;
    width: 588px;
    height: 159.5px;
    left: -142px;
    top: 0px;
    background-position: center center;


}
.clouds.move{
	-webkit-transition: 3s;
  -moz-transition: 3s;
  -ms-transition: 3s;
  -o-transition: 3s;
  transition: 10s;
  top:-100px;
}

.lever{
	width:48px;
	height: 112px;
	position: absolute;
	bottom: 1px;
	right: 20px;
}

.timetxt{
	position: absolute;
    height: 36px;
    width: 52px;
    top: 71px;
    left: 187px;
    background-position: center center;
}

.secondss{
	position: absolute;
    width: 48px;
    height: 32px;
        left: 165px;
    top: 46px;
    background-position: center center;
}

.mili{
	display: none;
	position: absolute;
    height: 16px;
    width: 24px;
        top: 47px;
    left: 217px;


    background-position: center center;
}
.header{
	background-position: center center;
position: absolute;
height: 30px;
width: 100%;
top: 0;
right: 0;
z-index: 1000;
}

.motion{
	position: absolute;
	width:400px;
	top:0px;
	opacity: 0;
}
.motion.move{

	-webkit-transition: 3s;
  -moz-transition: 3s;
  -ms-transition: 3s;
  -o-transition: 3s;
  transition: 10s;
  top:-100px;
}

.toppage4{
	width:320px;
	height: 244px;
	background: url("images/bingo.png");
	background-repeat: no-repeat;
    background-size: 100% 100%;
}
.gallery{
	width:320px;
	height: 236px;
	position: relative;
	overflow: hidden;
}

.rightArrow{
	    position: absolute;
    width: 30px;
    height: 55px;
    top: 80px;
    left: 277px;
}

.leftArrow{
	position: absolute;
    width: 30px;
    height: 55px;
    top: 80px;
    left:13px;
}

.slider{
	position: absolute;
	left:0;
	top:0;
	display: flex;
	transition: all 1s ease 0s;
}
.galpic{
	width:320px;
	height: 256px;
}

.clickmask{
	width: 100%;
    height: 215px;
    background: transparent;
    position: absolute;
    left: 0;
    top: 0;
	    /* width: 300px;
    height: 37px;
    background: transparent;
    position: absolute;
    left: 10px;
    top: 159px; */
}

/*.meter{
	position: absolute;
    width: 138px;
    height: 90px;
    left: 20px;
    top: 30px;
    background: url("images/meter.jpg");
	background-repeat: no-repeat;
    background-size: 100% 100%;

}*/

.blur{
	    transform: rotate(-198deg);
    transform-origin: bottom;
    position: absolute;
    width: 163px;
    height: 69.5px;
    left: -21px;
    top: -8px;
    z-index: 100;
    opacity: 0;
}
.blur2{
	    -webkit-transform: scaleX(-1);
    transform: scaleX(-1) rotate(160deg);
    /* transform: rotate(180deg); */
    transform-origin: bottom;
    position: absolute;
    width: 163px;
    height: 69.5px;
    right: -23px;
    top: -6px;
    z-index: 100;
    opacity: 0;
}
}

body{
	height: 480px;
	width:320px;
	max-width: 320px;
	max-height: 480px;
}

.roadstrip{
margin-top:10px;
}
.roadstripdiv{
	display: flex;
	flex-direction: column;
	z-index: 50;
position: absolute;
left: 161px;
top:-531px;
transition: all 4s ease 0s;
/* transform: rotate(-1deg); */
}
.roadstripdivnone{
	display: flex;
	flex-direction: column;
	z-index: 50;
position: absolute;
left: 161px;
top:-531px;
transition: none;
}

@-webkit-keyframes move {
    0% {
        transform:rotate(-90deg);
    }
    100% {
        transform:rotate(0deg);
    }
   /* 100% {
        transform:rotate(-90deg);
    }*/
}
