html, body {height:100%;}
body {
	margin:0; 
	padding:0; 
	font-family:arial; 
	font-size:12px; 
	text-align:center;
	background:#3e83c8 url(../images/bg_sky_gradient.jpg) repeat-x 0 bottom;
}

a {
	border:0; 
	outline:0; 
	text-decoration:none;
}

img {
	border:0;
}

div.clear {clear:both;}

#header {
	background:transparent url(../images/coles/bg_hdr.jpg) repeat-x 0 0; 
	height:34px;
}

	#hdrContent {
		margin:0 auto; 
		position:relative; 
		width:960px;
	}
	
	#hdrContent a {
		color:#000000 !important; 
		float:left; 
		height:34px; 
		line-height:33px; 
		padding:0 10px;
	}
	
	#hdrContent .separator {
		background:transparent url(../images/coles/separator.jpg) repeat scroll 0 0; 
		display:block; 
		float:left; 
		height:33px; 
		width:2px;
	}



.clouds {
	background: url(../images/bg_clouds.png) repeat-x 0 bottom;
} 

.gradient_sky {
	background:transparent url(../images/sky_bg.png) no-repeat center center;
}

#foil {
	background:transparent url(../images/foil_repeat.png) repeat-x center top; 
	height:150px; 
	margin-top:-135px; 
	position:relative; 
	z-index:1000; 
	text-align:center;
}

#ie6 {
	margin-top:-135px; 	
}

#ie6 #foil {
	maring:0;	
}

#ie6 p {
	position:relative; 
	z-index:2000;	
}

#foil p, #ie6 p {
	color:#de7110;
	padding-top:120px;	
}

#foil a, #ie6 a {
	color:#de7110;	
	font-weight:700;
}



#mask {
	width:100%;
	overflow:hidden;
	text-align:center;
}

.content {
	width:50%; 
	margin:0 auto;
	float:left;
	text-align:center;
	overflow:hidden;
}

#scroller {
	width:200%;
}

#main, #score {
	width:950px;
	margin:0 auto;	
}


#panel-1, #panel-2{

	position:relative;  
	height:660px;
}


#img_grass {
	display:block; 
	width: 844px; 
	height: 227px; 
	background:url(../images/grass.png) no-repeat 0 0; 
	position:absolute; 
	left:115px; 
	top:433px;
	z-index:20;
	position:relative;
}


#img_iphone	{
	display:block; 
	width: 284px; 
	height: 493px; 
	background:url(../images/iphone.png) no-repeat 0 0;
	position:absolute; 
	left:455px; 
	top:40px;
	z-index:5;
}

h1#img_logo {
	display:block; 
	width: 233px; 
	height: 199px; 
	background:url(../images/logo.png) no-repeat 0 0;
	position:absolute; 
	left:85px; 
	top:45px;
	text-indent:-999em;
}

p#img_msg {
	display:block; 
	width: 293px; 
	height: 180px; 
	background:url(../images/msg.png) no-repeat 0 0;
	position:absolute; 
	left:50px; 
	top:255px;
	text-indent:-999em;
}

p#img_msg_new {
	display:block; 
	width: 293px; 
	height: 180px; 
	background:url(../images/msg_new.png) no-repeat 0 0;
	position:absolute; 
	left:50px; 
	top:255px;
	text-indent:-999em;
}

a.btn_go {
	display:block; 
	width: 153px; 
	height: 231px; 
	background:url(../images/btnScores.png) no-repeat 0 0;
	position:absolute; 
	left:800px; 
	top:320px;
	text-indent:-999em;	
	cursor:hand; cursor:pointer;
}

#img_msg p {text-indent:-999em;}

#img_ray{

	background:url(../images/rays.png) no-repeat right top;
}

#img_btn {
	display:block; 
	width: 181px; 
	height: 58px; 
	background:url(../images/btnAppStore.png) no-repeat 0 0;
	position:absolute; 
	left:100px; 
	top:450px;
	cursor:hand; cursor:pointer;
	text-indent:-999em;
	z-index:25;
}


h2#leaderboard {
	display:block; 
	width: 402px; 
	height: 56px; 
	background:url(../images/hdr_leaderboard.png) no-repeat 0 0;
	position:absolute; 
	left:260px; 
	top:15px;
	text-indent:-999em;	
}



#board {
	display:block; 
	width: 666px; 
	height: 420px; 
	background:url(../images/bg_yellow.png) no-repeat 0 0;
	position:absolute; 
	left:140px; 
	top:80px;
	z-index:30;
	padding:7px 0 0 10px;
}

#board ul {
	width:306px;	
	margin:0;
	padding:0;
	float:left;
	list-style:none;
}

#board ul.extraMargin {
	margin-left:25px;	
}

#board li {
	width:306px;
	height:33px;
	margin:7px;	
}

#board li.red {
	background:url(../images/list_red.gif) no-repeat 0 0;	
	color:#fff;
}

#board li.yellow {
	background:url(../images/list_yellow.gif) no-repeat 0 0;	
	color:#f0382f;
}

#board li label.no, #board li label.name, #board li label.point {
	padding-top:10px;
	display:block;
	float:left;	
	text-align:left;
	font-weight:700;
}

label.no {
	width:46px;	
	padding-left:10px;
}

label.name {
	width:150px;	
}

label.point {
	width:82px;	
	white-space:nowrap;
}

#img_grass2 {
	display:block; 
	width: 844px; 
	height: 227px; 
	background:url(../images/grass.png) no-repeat 0 0; 
	position:absolute; 
	left:115px; 
	top:433px;
	z-index:20;
	position:relative;
}


a.btn_back {
	display:block; 
	width: 118px; 
	height: 231px; 
	background:url(../images/btnHome.png) no-repeat 0 0;
	position:absolute; 
	left:830px; 
	top:350px;
	text-indent:-999em;	
	cursor:hand; cursor:pointer;
}


a.btn_back2 {
	display:block; 
	width: 118px; 
	height: 231px; 
	background:url(../images/btnHome.png) no-repeat 0 0;
	position:absolute; 
	left:830px; 
	top:350px;
	text-indent:-999em;	
	cursor:hand; cursor:pointer;
}




#footer {
	width: 950px;
	position:relative;
	margin:0 auto;	

}



/* Easy Slider */


	#slider {
		display:block;
		width:320px;
		height:480px;
		position:absolute;
		left:481px;
		top:134px;
		z-index:10;
	}

	#slider ul, #slider li {
		margin:0;
		padding:0;
		list-style:none;
		}
		
	#slider li { 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:232px;
		height:345px;
		overflow:hidden; 
		}	
		
		
		
		
	#sliderSTOP {
		display:block;
		width:320px;
		height:480px;
		position:absolute;
		left:481px;
		top:134px;
		z-index:10;
	}

	#sliderSTOP ul, #sliderSTOP li {
		margin:0;
		padding:0;
		list-style:none;
		}
		
	#sliderSTOP li { 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:232px;
		height:345px;
		overflow:hidden; 
		}	
		
		
		
		
		
	#buttons {
		width:70px;
		height:42px;	
		position:absolute;
		top:442px;
		left:560px;
		z-index:25;
	}	
		
	#prevBtn, #nextBtn { 
		display:block;
		width:32px;
		height:42px;
		position:absolute;
		}	
	#prevBtn {
		top:0px;
		left:0px;
	}
	#nextBtn { 
		top:0px;
		right:0px;
	}														
	#prevBtn a, #nextBtn a {  
		display:block;
		position:relative;
		width:37px;
		height:37px;
		background:url(../images/buttonL.png) no-repeat 0 5px;	
		text-indent:-999em;
		}	
	#nextBtn a { 
		background:url(../images/buttonR.png) no-repeat 0 5px;	
		}
		
	#nextBtn a:hover, #prevBtn a:hover {
		background-position:0 0 !important;		
	}	
	
	
