html, body {
  width:100%;
  height:100%;
  overflow:hidden;
  margin: 0;
}
canvas {
	width:100%;
	height:100%;
}


.text_center {
	text-align: center;
}
.overlay {
	position: absolute;
	padding-right: 10px;
	padding-left: 10px;
	color: lightgray;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 50;
	border: solid gray 1px;
}
.top {
	top: 0;
}
.left {
	left: 0;
}
.right {
	right: 0;
}
.bottom {
	bottom: 0;
}
.float_right {
	float: right;
}


#settingsToggle {
	display: none;
}
#controlsHeader {
	text-align: right;
}
#controlsToggle {
	display: none;
}
#info {
	border: none;
}
#error {
	color: red;
	border: none;
}
input[type=button] {
	height: 25px;
}

input[type=range] {
	width: 250px;
	background: rgba(0, 0, 0, 0.75);
}
input[type=text] {
	width: 25px;
}
#gravity {
	width: 420px;
}
#density {
	width: 427px;
}



#page {
	display: none;
}
#loading {
	float: left;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
	width: 100%;
	height: 100%;
	background-color: rgba(192, 192, 192, 0.5);
	background-image: url("http://i.stack.imgur.com/MnyxU.gif");
	background-repeat: no-repeat;
	background-position: center;
}