@charset "utf-8";
/* CSS Document */

input[type=range] {
	-webkit-appearance: none;
	width: 100%;
	margin: 7px 0;
}

input[type=range]:focus {
	outline: none;
}

input[type=range]::-webkit-slider-runnable-track {
	width: 100%;
	height: 4px;
	cursor: pointer;
	box-shadow: 0px 0px 3px #777777, 0px 0px 0px #848484;
	background: rgba(221, 221, 221, 0.78);
	border-radius: 6px;
	border: 0px solid #000101;
}

input[type=range]::-webkit-slider-thumb {
	box-shadow: 1px 1px 2px #cccccc, 0px 0px 1px #d9d9d9;
	border: 2px solid #aaaaaa;
	height: 18px;
	width: 18px;
	border-radius: 9px;
	background: #ffffff;
	cursor: pointer;
	-webkit-appearance: none;
	margin-top: -7px;
}

input[type=range]:focus::-webkit-slider-runnable-track {
	background: rgba(255, 255, 255, 0.78);
}

input[type=range]::-moz-range-track {
	width: 100%;
	height: 4px;
	cursor: pointer;
	box-shadow: 0px 0px 3px #777777, 0px 0px 0px #848484;
	background: rgba(221, 221, 221, 0.78);
	border-radius: 6px;
	border: 0px solid #000101;
}

input[type=range]::-moz-range-thumb {
	box-shadow: 1px 1px 2px #cccccc, 0px 0px 1px #d9d9d9;
	border: 2px solid #aaaaaa;
	height: 18px;
	width: 18px;
	border-radius: 18px;
	background: #ffffff;
	cursor: pointer;
}

input[type=range]::-ms-track {
	width: 100%;
	height: 4px;
	cursor: pointer;
	background: transparent;
	border-color: transparent;
	color: transparent;
}

input[type=range]::-ms-fill-lower {
	background: rgba(185, 185, 185, 0.78);
	border: 0px solid #000101;
	border-radius: 12px;
	box-shadow: 0px 0px 3px #777777, 0px 0px 0px #848484;
}

input[type=range]::-ms-fill-upper {
	background: rgba(221, 221, 221, 0.78);
	border: 0px solid #000101;
	border-radius: 12px;
	box-shadow: 0px 0px 3px #777777, 0px 0px 0px #848484;
}

input[type=range]::-ms-thumb {
	box-shadow: 1px 1px 2px #cccccc, 0px 0px 1px #d9d9d9;
	border: 2px solid #aaaaaa;
	height: 18px;
	width: 18px;
	border-radius: 9px;
	background: #ffffff;
	cursor: pointer;
	height: 4px;
}

input[type=range]:focus::-ms-fill-lower {
	background: rgba(221, 221, 221, 0.78);
}

input[type=range]:focus::-ms-fill-upper {
	background: rgba(255, 255, 255, 0.78);
}

html, body {
	font-family: 'Open Sans', sans-serif;
	margin:0;
	padding:0;
	height:100%; /* needed for container min-height */
	background-color:#EEEEEE;
}
h1{
	font-family: 'Open Sans', sans-serif;
	font-size:24px;
	font-style:normal;
	font-weight:bold;
	margin-top:6px;
	color:#0099FF;
}
h2{
	font-family: 'Open Sans', sans-serif;
	font-size:18px;
	font-style:normal;
	font-weight:bold;
	margin-top:10px;
	color:#0099FF;
}
li{
	margin-bottom:6px;
}

img{
	border:0px;
}

a:link {
  text-decoration: none;
	color: #444444;
}

a:visited {
  text-decoration: none;
	color: #444444;
}

a:hover {
  text-decoration: none;
	color: #444444;
}

a:active {
  text-decoration: none;
	color: #444444;
}

#container {
	width: 1040px;
	margin-left:auto;
	margin-right:auto;
	font-size:16px;
	background-color:#FFFFFF;
}
#game {
	position: relative;
	margin-top:20px;
	margin-left:40px;
}
#boxspace {
	 min-height:500px;
     height:auto !important;
     height:500px;
}
#footer {
	margin-bottom:0px;
	margin-top:20px;
	height:40px;
	width:100%;
	background-color:#777777;
	vertical-align:middle;
}
#footer div {
	position:relative;
	top:0px;
	left:40px;
	height:40px;
	line-height: 40px;
	text-align: left;
	font-family: 'Raleway', sans-serif;
	color:#DDDDDD;
	font-size: 13px;
}

#game form {
	vertical-align: middle;
	line-height: 16px;
}

#BoxWidthText {
	float: left;
	vertical-align: middle;
}

#canvasWidth {
	float: left;
	vertical-align: middle;
}

#BoxHeightText {
	float: left;
	vertical-align: middle;
}

#canvasHeight {
	float: left;
	vertical-align: middle;
}

#tempSlider {
	float: left;
	vertical-align: middle;
}

.formspacer {
	float: left;
	width: 10px;
	height: 2px;
}

.formspacer2 {
	float: left;
	width: 5px;
	height: 2px;
}

#HeatText {
	float: left;
	line-height: 18px;
	vertical-align: middle;
}

#allowheatflow {
	float: left;
	vertical-align: middle;
}

#accountforwallwork {
	float: left;
	line-height: 16px;
	vertical-align: middle;
}

#WorkText {
	float: left;
	line-height: 18px;
	vertical-align: middle;
}

#averageke {
	height: 40px;
	width: 400px;
}

#menu {
	font-family: 'Raleway', sans-serif;
	position: relative;
	margin-top: 10px;
	margin-left: 0px;
	height:38px;
	width:1040px;
	background-color:#FFFFFF
}
#menustart {
	float: left;
	margin-top:0px;
	margin-left:0px;
	height:38px;
	width:40px;
}
#menufooter {
	margin-top:0px;
	margin-left:0px;
	height:4px;
	width:1040px;
	background-color:#EEEEEE;
	text-align: center;
}

#controlsbox {
width: 100%;
height: 60px;
margin-top:10px;
}

#controls2 {
float: left;
}

#controls3 {
float: left;
margin-left:40px;
}

#pressurereadout {
float: right;
margin-left:20px;
}

.menuspacer {
	float: left;
	margin-top:2px;
	margin-left:0px;
	height:36px;
	width:1px;
	background-color:#EEEEEE;
}
.menuitem {
	float: left;
	margin-top: 0px;
	margin-left: 0px;
	height:38px;
	width:150px;
	text-align: center;
	font-size: 15px;
	line-height:43px;
	background-color:#FFFFFF
}
.menuhighlight {
	position: absolute;
	margin-top: 0px;
	margin-left:1px;
	height:6px;
	width:148px;
	background-color:#0099FF;
	opacity:0;
	-webkit-transition: opacity 80ms linear;
	 -moz-transition: opacity 80ms linear;
	 transition: opacity 80ms linear;
}
input[type='range'] {
	padding-left:2px;
	padding-right:2px;
	width:150px;
}
.overlay {
     visibility: hidden;
	 opacity: 0;
     position: absolute;
     left: 0px;
     top: 0px;
     width:100%;
     height:100%;
     text-align:center;
     z-index: 1000;
	 background-image:url(images/fade.png);
	 -webkit-transition: opacity 250ms linear;
	 -moz-transition: opacity 250ms linear;
	 transition: opacity 250ms linear;
}
.popupcontent {
	text-align:left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	background-color:#FFFFFF;
	overflow-y:auto;
	padding-left:10px;
	padding-right:10px;
}