
.stars, .twinkling, .clouds {
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
width:100%;
height:100%;
display:block;
}
.stars {
background: -webkit-gradient(linear, left top, left bottom, from(#f0526f), to(#f8db49));
background: linear-gradient(#f0526f 0%, #f8db49 100%); 
z-index:-3;
}

html, body {
  margin: 0px;
  padding: 0px;
}

#starsImage {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	background-repeat: repeat;
    background-image: url("../img/stars3.png");
}

#rocketGameContainer {
	position: relative;
	width: 100%;
	height: 540px;
	-webkit-user-select: none;  
	-moz-user-select: none;    
	-ms-user-select: none;      
	user-select: none;
	z-index: 1000;  
}

#rocketGameContainer canvas {
	z-index: 1000;    
	-webkit-user-select: all;    
	   -moz-user-select: all;    
	    -ms-user-select: all;    
	        user-select: all;
}

#keys {
	position: absolute;
}

#mouseIcon {
	position: absolute;
}

/************************************************************************************
MEDIA QUERIES
*************************************************************************************/

/* for 989px or less */
@media screen and (max-width: 989px) {
	#rocketGameContainer {
		visibility: hidden;		
	}

	#keys {
		visibility: hidden;		
	}

	#mouseIcon {
		visibility: hidden;		
	}
}

/* for 767px or less */
@media screen and (max-width: 767px) {
	#rocketGameContainer {
		visibility: hidden;		
	}

	#keys {
		visibility: hidden;		
	}

	#mouseIcon {
		visibility: hidden;		
	}
}

/* for 639px or less */
@media screen and (max-width: 639px) {
	#rocketGameContainer {
		visibility: hidden;		
	}

	#keys {
		visibility: hidden;		
	}

	#mouseIcon {
		visibility: hidden;		
	}
}

/* for 479px or less */
@media screen and (max-width: 479px) {
	#rocketGameContainer {
		visibility: hidden;		
	}

	#keys {
		visibility: hidden;		
	}

	#mouseIcon {
		visibility: hidden;		
	}
}