body {
	overflow: hidden;
}

#main, #modals {
	position: absolute;
	left: 0px;
	top: 0px;
	bottom: 0px;
	right: 0px;
}

#modals {
	z-index: 999;
	pointer-events: none;
	right: 170px;
}

body.embedded #modals {
	right: 0px;
}

div.modal {
	display: none;
	position: absolute;
	pointer-events: auto;
	padding: 16px;
	background-color: rgba(0, 0, 0, 0.75);
	border-color: white;
	border-style: solid;
	border-size: 2px;
	border-radius: 24px 24px;
	-moz-border-radius: 24px 24px;
	-webkit-border-radius: 24px 24px;
	-ms-border-radius: 24px 24px;
}

button, input, div.modal {
	font-family: Calibri, Tahoma, Verdana, sans-serif;
}

div.modal h1, div.modal h2, div.modal h3 {
	margin-top: 4px;
	margin-bottom: 10px;
	text-align: center;
}

div.modal, div.modal input {
	font-size: 16pt !important;
}

div.modal button {
	font-size: 20pt !important;
	font-weight: bold;
}

body.embedded div.modal, body.embedded div.modal input {
	font-size: 12pt !important;
}

body.embedded div.modal button {
	font-size: 14pt !important;
}

input#levelUrl {
	font-family: Consolas, Courier New, monospace;
	font-size: 11pt;
}

#uploadLevelDialog .inputBoundary {
	width: 400px;
	height: 38px;
	position: relative;
	padding: 0px;
	margin: 0px;
	margin-bottom: 4px;
}

#uploadSuccessful .inputBoundary, #socialContainer {
	width: 500px;
	position: relative;
	padding: 0px;
	margin: 0px;
	margin-bottom: 6px;
}

#uploadSuccessful p, #loadFailed p {
	margin-top: 4px;
	margin-bottom: 6px;
	max-width: 500px;
}

#uploadSuccessful .inputBoundary {
	min-height: 38px;
}

#socialContainer, #uploadSuccessful p {
	text-align: center;
}

.inputBoundary label {
	position: absolute;
	top: 4px;
	left: 0px;
}

#uploadSuccessful .inputBoundary input {
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
}

.inputBoundary input {
	position: absolute;
	top: 0px;
	right: 0px;
}

img#controls {
	border: 0px;
	margin: 0px;
	padding: 0px;
}

#viewport {
	position: absolute;
	left: 0px;
	top: 0px;
	right: 170px;
	bottom: 1.5em;
}

body.embedded #viewport {
	right: 0px;
	bottom: 0px;
}

#rightpanel {
	position: absolute;
	right: 0px;
	top: 0px;
	bottom: 0px;
	width: 170px;
	overflow-x: hidden;
	overflow-y: auto;
}
#bottompanel {
	position: absolute;
	bottom: 0px;
	right: 170px;
	left: 0px;
	height: 1.5em;
	text-align: center;
	overflow-x: hidden;
	overflow-y: auto;
}

body.embedded #rightpanel, body.embedded #bottompanel {
	display: none;
}

#directions h1 {
	font-size: 18pt;
	font-weight: bold;
	margin-top: 4px;
	margin-bottom: 8px;
}
#supportedBrowsers h3 {
	font-size: 12pt;
	font-weight: bold;
	margin-bottom: 8px;
}
#directions ul, #supportedBrowsers ul {
	list-style-type: none;
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0.5em;
	padding-right: 0em;
}
#directions p, #directions li {
	font-size: 14pt;
	font-weight: normal;
}
#directions h1, h3, p, li, small {
	background-color: black;
}
#supportedBrowsers li {
	font-size: 12pt;
	font-weight: normal;
}
#supportedBrowsers img {
	border-width: 0px;
}

#canvas, #loadingProgress {
	display: block;
	position: absolute; 
	top: 0px; 
	left: 0px; 
	bottom: 0px; 
	right: 0px;
	margin: auto;
}

#canvas {
	background-color: black;
	background-repeat: no-repeat no-repeat;
	background-position: center center;
	background-size: contain;
	border: 0px;
	padding: 0px;

	image-rendering: optimizeSpeed; 
	image-rendering: -moz-crisp-edges; 
	image-rendering: -o-crisp-edges; 
	image-rendering: -webkit-optimize-contrast; 
	-ms-interpolation-mode: nearest-neighbor;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;

	-webkit-user-drag: none; 
	-moz-user-drag: none; 
	user-drag: none;
}

#loadingProgress {
	background-color: rgba(0, 0, 0, 0.75);
	width: 250px;
	height: 250px;

	border-color: rgb(30, 90, 180);
	border-width: 3px;
	border-style: solid;

	border-radius:         250px 250px;
	-moz-border-radius:    250px 250px;
	-webkit-border-radius: 250px 250px;
	-ms-border-radius:     250px 250px;

	text-align: center;
}
#loadingProgress span {
	position: absolute;
	left: 0px;
	right: 0px;
	text-align: center;
	top: 32px;
	text-shadow: black 1px 1px 2px;
}

#progressIndicator {
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
}

.overlayPanel {
	position: absolute;
	background-color: rgba(0, 0, 0, 0.8);
	margin: 4px;
	border: 0px;
	padding: 8px;
	left: 0px;
	right: 160px;
}

#log {
	font-family: Consolas, Courier New, Courier;
	font-size: 12pt;
	height: 300px;
	overflow-x: hidden;
	overflow-y: scroll;
	bottom: 0px;
}

#levelInfo, #levelNotFound, #runningSlowly {
	padding: 1em;
	padding-right: 146px;
}
.overlayPanel h2 {
	font-size: 18pt;
	font-weight: normal;
}
.overlayPanel p, .overlayPanel h2 {
	margin: 0px;
}
#currentUserLevelName, #currentUserLevelAuthorName {
	font-weight: bold;
}
#currentLevelPlayCount {
	font-family: Consolas, Courier New, Courier;
}

#closeLevelInfo, #closeLevelNotFound, #closeRunningSlowly {
	position: absolute;
	right: 16px;
	top: 16px;
	bottom: 16px;

	height: 32px;
	width: 120px;
	margin: auto;
}

#fullscreenButton, #logButton {
	display: block;
	margin-top: 2px;
	margin-left: auto;
	margin-right: auto;
	width: 140px;
	height: 34px;
}

button {
	font-size: 12pt;
}

#stats {
	text-align: center;
	margin-top: 4px;
}

#fpsIndicator {
	display: inline-block;
	border-color: white;
	border-style: solid;
	border-width: 2px;
	border-radius:         12px 12px;
	-moz-border-radius:    12px 12px;
	-webkit-border-radius: 12px 12px;
	-ms-border-radius:     12px 12px;
	width:  14px;
	height: 14px;
}

#browseLevels {
	text-align: center;
}

#browseLevels button, #uploadSuccesful button {
	width: 250px;
}

#browseLevelsList {
	background-color: transparent;
	border: 0px;
	padding: 0px;
	margin: 0px;
	width: 790px;
	height: 550px;
}

.controlsImage {
	display: none;
	position: relative;
	float: left;
	clear: both;
	background-repeat: no-repeat no-repeat;
	min-width: 160px;
	min-height: 51px;
}

.controlsImage .text {
	text-align: center;
	display: inline-block;
	position: absolute;
	right: 0px;
	top: 0px;
	bottom: 0px;
	left: 51px;
	height: 1em;
	margin-top: auto;
	margin-bottom: auto;
}

#controlsRetry {
	background-image: url("../Images/controlsRetry.png");
}

#controlsMenu {
	background-image: url("../Images/controlsMenu.png");
}

#cornerLogo {
	display: block;
	position: absolute;
	z-index: -1;
	max-width: 170px;
	height: 104px;
	right: 0px;
	bottom: 0px;
	border: 0px;
	margin: 0px;
	padding: 0px;
}

#betaBadge {
	position: absolute;
	display: block;
	z-index: 0;
	right: 16px;
	bottom: 10px;
	background-color: rgb(0, 0, 110);
	color: white;
	font-weight: bold;
	font-size: 11pt;
	text-align: right;
}

#cornerLogo img {
	border: 0px;
	margin: 0px;
	padding: 0px;
}

#weekendInfo {
}

#scriptsNotLoaded, #noscript {
	position: absolute;
	display: block;
	z-index: 999;
	left: 0px;
	right: 0px;
	top: 0px;
	bottom: 0px;
	background-color: black;
}