body, html {
	font-family: Monospace;
	background-color: #000;
	margin: 0;
	padding:0;
	/*background-repeat:no-repeat;
	background-size:cover;
	background-image:url("img/space.jpg");
	background-position:center center;*/
	color:white;
	
	font-family:Arial;
}

.titl {
	font-size:60px;
}

#mainDiv {
	width:80%; 
	max-width:1000px; 
	min-width:500px;
	height:600px;
	margin:auto;
	text-align:center;
}

#mainTable {
	width:100%;
}

#renderSpace {
	width:500px; 
	height:400px; 
	margin:auto;
}

.forMob{ 
	display:none;
}

ul{
	text-align:left;
	-webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
}

.wait {
	width:45px;
	visibility:hidden;
}

@media screen and (max-width: 499px) {
	body, html{
		overflow-x:hidden;
	}
	.forMob{
		display:block;
	}
	.desktop {
		display:none;
	}
}

@media screen and (max-width: 380px) {
	#renderSpace {
		width:300px;
		height:300px;
	}
	
	#mainDiv {
		text-align:left;
		width:320px;
		margin:0;
		text-align:center;
	}
	
	#mainTable {
		width:320px;
	}

	.forMob{
		width:320px;
	}
	
	.titl {
		font-size:40px;
		position:relative;
		left:-70px;
	}
}

@media screen and (min-width:381px) and (max-width:420px) {
	#renderSpace {
		width:400px;
		height:400px;
	}
	
	#mainDiv {
		text-align:left;
		width:410px;
		margin:0;
		text-align:center;
	}
	
	#mainTable {
		width:320px;
	}

	.forMob{
		width:400px;
	}
	
	.titl {
		font-size:50px;
		position:relative;
		left:-50px;
	}	
}

@media screen and (min-width:500px) and (max-width:800px) {
	#renderSpace {
		width:500px;
		height:500px;
		margin-left:auto;
		margin-right:auto;
	}
	
	#mainDiv {
		text-align:center;
		width:100%;
		margin:0;
	}
	
	#mainTable {
		width:320px;
	}

	.forMob{
		width:400px;
		margin:auto;
		display:block;
	}
	
	.desktop {
		display:none;
	}
	
	.titl {
		font-size:50px;
		position:relative;
		left:-50px;
	}
}