
body {
	padding: 0px; margin: 0px; 
}

body#finish {
	background: url(../images/bg_clouds.png);
}

body #loading {
	margin: 50px auto;
	max-width: 1024px;
	position: fixed;
	width: 100%;
	height: 100%;
	text-align: center;
}

body #loading #loading_container {
	position: relative;
	margin: 0 auto;
	width: 50%;
	height: 40px;
	background: #aaccff;
	padding: 10px;
	-webkit-box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 0.3);
	-moz-box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 0.3);
	box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 0.3);
}

body #loading #loading_container #loading_progress {
	display: block;
	height: 100%;
	width: 0;
	color: #fff;
	background-color: #2bc253;
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #2bc253), color-stop(1, #54f054));
	background-image: -webkit-linear-gradient(center bottom, #2bc253 37%, #54f054 69%);
	background-image: -moz-linear-gradient(center bottom, #2bc253 37%, #54f054 69%);
	background-image: -ms-linear-gradient(center bottom, #2bc253 37%, #54f054 69%);
	background-image: -o-linear-gradient(center bottom, #2bc253 37%, #54f054 69%);
	-webkit-box-shadow: inset 0 2px 9px rgba(255, 255, 255, 0.3), inset 0 -2px 6px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: inset 0 2px 9px rgba(255, 255, 255, 0.3), inset 0 -2px 6px rgba(0, 0, 0, 0.4);
	position: relative;
	overflow: hidden;
}

body #loading #loading_container #loading_progress span {
	position: absolute;
	left: 0;
	height: 100%;
	width: 100%;
	top: 25%;
	display: block;
	font-family: sans-serif;
}

/* Level art */

.hidden {
	display: none;
}

.level-comic {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 99999;
}

.level-comic#main-screen {
	background: #000 url(../images/comics/startscreen.png) center center no-repeat;
	background-size: 100%;
}

.level-comic#scene-1 {
	background: #000 url(../images/comics/potatoman_scene1.png) center center no-repeat;
	background-size: 100%;
}

.level-comic#scene-2 {
	background: #000 url(../images/comics/potatoman_scene2.png) center center no-repeat;
	background-size: 100%;
}

.level-comic#scene-3 {
	background: #000 url(../images/comics/potatoman_scene3.png) center center no-repeat;
	background-size: 100%;
}

.level-comic#before-level-2 {
	background: #000 url(../images/comics/potatoman_scene4.png) center center no-repeat;
	background-size: 100%;
}

.level-comic#before-level-3 {
	background: #000 url(../images/comics/potatoman_scene5.png) center center no-repeat;
	background-size: 100%;
}

.level-comic#finish-screen #finish-text {
	width: 240px;
	background-color: #fff;
	border: 3px solid #444;
	margin: auto;
	margin-bottom: 20px;
	padding: 20px;
}

.level-comic#finish-screen {
	position: relative;
	background: none;
}

.level-comic#finish-screen .level-comic-container {
	margin: 0; padding: 0;
	padding-top: 20px;
	padding-bottom: 20px;
	text-align: center;
}

.level-comic#finish-screen .level-comic-container .finish-actions {
	display: block;
	width: 100%;
	max-width: 200px;
	margin: auto;
	padding: 20px 40px 20px 40px;
	background: #eee;
	border: 3px solid #444;
	margin-bottom: 20px;
	cursor: pointer;
	font-size: 20px;
}

.level-comic#finish-screen .level-comic-container .finish-actions:hover {
	background: #000;
	color: #fff;
	border: 3px solid #111;
}

.level-comic#finish-screen #finish-credits {
	background: #ccc;
	padding: 10px;
	border: 3px solid #444;
	max-width: 260px;
	margin: auto;
}

.level-comic#finish-screen #credit-by {
	font-size: 20px;
	font-weight: bold;
}

.level-comic#finish-screen #credit-name1, 
.level-comic#finish-screen #credit-name2 {
	margin-top: 20px;
}

.level-comic .level-comic-container {
	font-family: Arial, Sans-serif;
}

.level-comic .level-comic-container p {
	padding: 0px; margin: 0px;
	margin-bottom: 25px;
	font-size: 20px;
}

.level-comic .level-comic-container .level-comic-button {
	background: #eee;
	padding: 10px 25px 10px 25px;
	color: #000;
	font-size: 25px;
	cursor: pointer;
	border-radius: 15px;
}

.level-comic .level-comic-container .level-comic-button:hover {
	color: #eee;
	background: #000;
}