#MobileControls
{

  margin-left:auto;
  margin-right:auto;
  padding-top:15px;	
  padding-left:30px;
  opacity:0.5;
  display:none;
  width:260px;
}
#MobileControls .button
{
  background-color:rgb(144,144,144);
  border-radius:10px;
  padding:5px;
  text-align:center;
  height:50px;
  width:70px;
  
}
#topbar
{
   position:relative;
}
.containerClass
{
	 width:450px;
	 margin-left:auto; 
	 margin-right:auto;
   position:relative;
   //text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
   max-width:100%;
   text-shadow: black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px, black 0 0 3px;
  
}
#usersname
{
  margin:auto;
  width:225px;
}
#usersname input
{
  border:1px solid #00FF00;;
  background:rgba(0,0,0,0.5);
  color:#00FF00;
}
#ShowUsersName
{
  font-size:22px;
  color:grey;
  height:20px;
  text-align:center;
  width:100%;
}
#timeBoardDiv
{
  float:left;

}
#scoreBoards
{
  width:625px;
  max-width:100%;
  margin-left:auto;
  margin-right:auto;

}
#scoreBoardDiv
{
  float:left;
  padding-right:20px;
    padding-bottom:15px;
}
.LeaderboardClass
{
  max-height:400px;
  overflow-y:scroll;
}  
    /* width */
    .LeaderboardClass::-webkit-scrollbar
     {
        width: 5px;   
    }
    
    /* Track */
    .LeaderboardClass::-webkit-scrollbar-track 
    {
        background: transparent; 
    }
     
    /* Handle */
    .LeaderboardClass::-webkit-scrollbar-thumb 
    {
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.9);
        background: grey;
    }
    
    /* Handle on hover */
    .LeaderboardClass::-webkit-scrollbar-thumb:hover 
    {
        background: #555; 
    }
    .LeaderboardClass th
    {
      color:white;
    }
    .LeaderboardClass td,.LeaderboardClass th
     {
        border:0px;
     }
    .LeaderboardClass tr:nth-child(odd)
    {
      background:rgba(204,0,0,0.2);
    }
body
{ 	
	 color:#00FF00;
   font-family: 'Mina', sans-serif;
  background-image:url("images/space3.jpg");
}

#spaceship
{
  height:20px;
  width:20px;
}

#scoreboard, #smallcontainer div,#timeBoardDiv td
{
  background:rgba(0,0,0,0.5);
}

#helpdiv
{
  visibility:hidden; 
  color:#ffffff; 
  height:620px; width:600px; 
  margin-top:-530px; 
  margin-left:auto; 
  margin-right:auto; 
  background:rgba(0,0,0,0.8);
  border:#FFFFFF sold thin; 
  line-height:17px;
  font-size:15px;
  position:absolute;
  z-index: 1000; 
 // font-family:arial;
  
}

#key 
{
  border:0px solid black;
  margin-left:auto;
  margin-right:auto;
}

.blackGround
{

	color:#FFFF00;
	font-weight:bold;
	height:20px;
	width:20px;
	line-height:15px;
  
  background-color:transparent;
  border-color:transparent;
}
.LifeTile
{
  height:20px;
  max-width:20px;
  border: 3px solid white;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box; 
  border-radius:10px; 
  //outline: 1px solid limegreen;
}

.cClass
{
	//background-color:#000000;
  border:1px solid white;
}

#LevelTable td
{
   /* border-width:3px;  
    border-style:outset;
    border-radius: 5px;    */
    color:#FFFF00;
  	font-weight:bold;
  	height:25px;
  	width:20px;
    line-height:18px;
    padding:0px;
    font-family:"Comic Sans MS";
     background-size:25px 25px;
}

.purpleGround	
{
  background-image:url(images/purple3.png);
  background-size:25px 25px;
}
.darkRedGround
{
  background-image:url(images/darkRed3.png);
}
.blueGround	
{
    /*background-color:blue;border-color:blue; */
    background-image:url(images/blue3.png);
}
.greenGround	
{
	background-image:url(images/green3.png);
}
.redGround	
{
	background-image:url(images/red3.png);
}
.cyanGround	
{
	background-image:url(images/cyan3.png);
}
.orangeGround	
{
	background-image:url(images/orange3.png);
}
.yellowGround	
{
	background-image:url(images/yellow3.png);
}
.yellowOutlineGround	
{
	background-image:url(images/yellowOutline3.png);
}
.shrink
{
  -webkit-transform:scale(0.9);
  -moz-transform:scale(0.9);
  -ms-transform:scale(0.9);
  transform:scale(0.9);
  margin-left:-25px;
}
#setScoreDiv, #LevelCompleteOverlay
{
  visibility:hidden;	
}
#LevelCompleteOverlay
{
  font-size:20px;
}
#smallContainer
{
  height:20px; 
  width:353px; 
  margin-left:auto; 
  margin-right:auto;
  max-width:100%;
  //padding-left:30px;
}
#livesVal, #levelVal
{
  color:limegreen;
  float:left;
}
.GameOverlay
{
 	background-color:rgba(0,0,0,0.8);
	height:430px;
	width:430px;
	position:absolute;
	//margin-left:auto;
  //margin-right:auto;	
  margin-top:0px;
  z-index:10;
  padding:10px;
  text-align:center;
}
.GameOverlay h1
{
  text-align:center;
  font-weight:bold;
  font-size: 40px;
  margin-top:100px;
  text-shadow: 7px 7px 10px limegreen;
  color:white;
}
.DeathMessage
{
  color:red;
}
.DeathMessage span
{
  text-shadow: 7px 7px 10px darkred;
  font-size:50px;
  font-weight:bold;
}
#NewGameButton
{
  padding-left:20px;
  padding-right:20px;
  padding-bottom:5px;
  padding-top:5px;
 	//background-color:rgba(255,255,255,0.2);
  border-color:orange;
  letter-spacing:6px;
  text-shadow: 2px 2px 2px green;
  text-shadow: -2px -2px -2px green;
  font-size:30px;
  border-top:1px solid darkgrey;
}
#NewGameButton:hover
{
  background-color:white;
  cursor:pointer;
}
#Warning
{
  color:red;
  font-size:12px;
}
#createHelpDiv
{
	background-color:#333;
	height:540px;
	width:200px;
	position:absolute;
	top:0px;
	left:0px;	
	visibility:hidden;	
}
#helpDiv
{
 padding:8px;
}
#LevelTable
{
  border-spacing:3px;
  width:430px;
  height:430px; 
  //outline:30px solid rgba(0,0,0,0.2);
  text-align:center;
 // margin:auto;
  margin-top:0px;
  background:rgba(0,0,0,0.3);
  border-radius:10px;
}

.option
{
   cursor:pointer;
}
.option:hover
{
  background-color:white;
}