body {
	margin: 0;
	padding: 0;
	background-color: #000;
}

#wrapper {
	height:365px;		/* Of course you need to specify the object height */

	position:relative;	/* On older OS versions "position" and "z-index" must be defined (absolute | relative), */
	z-index:1;			/* it seems that recent webkit is less picky and works anyway. */

	width:100%;
	
	background-image: url(images/background.png);
	background-repeat: no-repeat;
	background-size:320px 366px;
	overflow:hidden;
	
	text-align: center;

}

#wrapperLoad {
	height:480px;		/* Of course you need to specify the object height */

	position:relative;	/* On older OS versions "position" and "z-index" must be defined (absolute | relative), */
	z-index:1;			/* it seems that recent webkit is less picky and works anyway. */

	width:100%;
	
	overflow:hidden;
	
	text-align: center;

}


#scroller {
	/*	-webkit-touch-callout:none;*/
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	float:left;
	width:100%;
	padding:0;
	background-image: none;
	
	
/*	-webkit-box-shadow:0 0 8px #555;	/* Don't use box shadows, they slow down drastically CSS animations */
}


input { /* search bar */
	height:18px;
	width:250px;	
}


#container {
	width: 320px;
	height: 460px;
}

#container #header {
	width: 320px;
	height: 45px;
	background-image: url(images/top_bar.png);
	background-repeat: repeat-x;
	background-size:2px 45px;
	font-family: "Helvetica Neue";
	color: #FFF;
	text-align: center;
	font-size: 20px;
	line-height: 42px;
	text-shadow: rgba(255,255,255,.2) 0 1px 1px;
	background-position: center center;
	font-weight: bold;
}

#container #header #back_btn {
	float: left;
	height: 45px;
	width: 75px;
}

#container #header #header_title {
	float: left;
	width: 170px;
	height: 45px;
	font-family: "Helvetica Neue";
	font-size: 20px;
}

#container #header #header_right {
	float: left;
	width: 75px;
	height: 45px;
	
}


#wrapper #scroller #vspace {
	width: 320px;
	height: 15px;
}

#wrapper #scroller #bts {
	width: 320px;
	height: 110px;
}

#wrapper #scroller #mrta {
	width: 320px;
	height: 110px;
}

#wrapper #scroller #sarl {
	width: 320px;
	height: 110px;
}

#wrapper #scroller #tickets {
	width: 320px;
	height: 70px;
}

#wrapper #scroller #timetable {
	width: 320px;
	height: 70px;
}

#wrapper #scroller #routemap {
	width: 320px;
	height: 70px;
}

#container #footer {
	background-image: url(images/bottom_bg.jpg);
	background-repeat: repeat-x;
	width: 320px;
	height: 50px;
	color: #FFF;
	float: left;
	z-index: 2;
	position:fixed;
	top:410px;
}
#container #footer #btn1 {
	width: 64px;
	height: 50px;	
	float: left;
	
}
#container #footer #btn2 {
	width: 64px;
	height: 50px;
	float: left;
}
#container #footer #btn3 {
	width: 64px;
	height: 50px;
	float: left;
}
#container #footer #btn4 {
	width: 64px;
	height: 50px;
	float: left;
}
#container #footer #btn5 {
	width: 64px;
	height: 50px;
	float: left;
}

#wrapper #search {
	background-image: url(images/searchbar.jpg);
	background-repeat: repeat-x;
	width: 320px;
	height: 30px;
	
	padding-top: 3px;
	padding-bottom: 0px;
	
	z-index:25;
}

#wrapper #head_items {
	height: 40px;
	width: 320px;
	z-index:20;
	position:absolute;
	padding-top: 8px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	background-color: #4a4a4a;
}


#wrapper #head_title {
	height: 40px;
	width: 320px;
	z-index:20;
	position:fixed;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	background-color: #4a4a4a;
	vertical-align:middle;
}


#wrapper #items_journey {
	height: 40px;
	width: 320px;
	padding-top: 10px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	background-color: transparent;
}

#wrapper #save_journey {
	height: 40px;
	width: 320px;
	padding-top: 280px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	background-color: transparent;
	position:absolute;
	z-index:22;
}

#container #wrapper #scroller #items_list {
	width: 320px;
	height: 300px;
	text-align: center;
	float: left;
	position:absolute;
	z-index:15;
	top: 50px;
	padding-top: 15px;
	overflow: hidden;
}

#container #wrapper #scroller #j_result_list {
	width: 320px;
	height: 300px;
	text-align: center;
	float: left;
	position:absolute;
	z-index:15;
	top: 50px;
	padding-top: 5px;
	overflow: hidden;
}


#container #wrapper #content_left {
	background-image: none;
	float: left;
	height: 300px;
	width: 120px;
	top: 50px;
	position: absolute;
	text-align:center;
	z-index: 2;
}

#container #wrapper #content_left_mrt_time {
	background-image: none;
	float: left;
	height: 300px;
	width: 120px;
	top: 0px;
	position: absolute;
	text-align:center;
	z-index: 2;
}

#container #wrapper #content_left_time {
	background-image: none;
	float: left;
	height: 300px;
	width: 120px;
	top: 0px;
	position: absolute;
	text-align:center;
	z-index: 2;
}


#container #wrapper #content_SL_line {
	background-image: none;
	float: left;
	height: 800px;
	width: 200px;
	top: 75px;
	left:130px;
	position: relative;
	text-align:left;
	z-index: 2;
	overflow: hidden;
}

#container #wrapper #content_SK_line {
	background-image: none;
	float: left;
	height: 450px;
	width: 200px;
	top: 75px;
	left:130px;
	position: relative;
	text-align:left;
	z-index: 2;
	overflow: hidden;
}


#container #wrapper #content_MRT_line {
	background-image: none;
	float: left;
	height: 900px;
	width: 200px;
	top: 75px;
	left:130px;
	position: relative;
	text-align:left;
	z-index: 2;
	overflow: hidden;
}

#container #wrapper #content_MRT_time {
	background-image: none;
	float: left;
	height: 860px;
	width: 200px;
	top: 25px;
	left:130px;
	position: relative;
	text-align:left;
	z-index: 2;
	overflow: hidden;
}

#container #wrapper #content_city_line {
	background-image: none;
	float: left;
	height: 350px;
	width: 200px;
	top: 75px;
	left:130px;
	position: relative;
	text-align:left;
	z-index: 2;
	overflow: hidden;
}

#container #wrapper #content_express_line {
	background-image: none;
	float: left;
	height: 250px;
	width: 200px;
	top: 75px;
	left:130px;
	position: relative;
	text-align:left;
	z-index: 2;
	overflow: hidden;
}

#container #wrapper #scroller #left_stations_list {
	float: left;
	width: 200px;
	height: 800px;
	top: 50px;
	left:5px;
	position:relative;
}


#random_time_right {
	height: 555px;
	width: 200px;
	top:100px;
	left:150px;
	position:fixed;
}

#map_plan {
	height: 325px;
	width: 320px;
	top:40px;
	position:fixed;
}

#container #wrapper #track_iframe {
	height: 325px;
	width: 320px;
	top:85px;
	position:fixed;
}

#container #wrapper #time_scroll {
	height: 325px;
	width: 320px;
	top:90px;
	position:fixed;
}

#select_tickets {
	width: 320px;
	top:60px;
	height:800px;
	position:fixed;
}