* {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border-sizing: border-box;
}

body , document, html {
	margin: 0;
	font-family: 'Helvetica Neue';
	background: #eee;
	width: 100%;
	height: 100%;
}

.loading,
.size-warning {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 9001;
	background: white;
}

.size-warning {
	display: none;
}

.loading h1,
.size-warning h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	height: 100px;
	width: 550px;
	margin: -50px 0 0 -275px;
	font-size: 50px;
	line-height: 100px;
	text-align: center;
	text-transform: uppercase;
}

.game {
	position: fixed;
	top: 10px;
	right: 10px;
	bottom: 10px;
	left: 10px;
}

.movement {
	position: fixed;
	left: 10px;
	top: 50%;
}

#bomb {
	position: fixed;
	right: 10px;
	top: 10px;
	bottom: 10px;
	/*height: 100%;*/
	width: 38%;
	background-color: grey;
	background-image: url('/img/sex-bob-omb.png');
	background-position: center center;
	border-radius: 10px;
}

.control {
	text-align: center;
	background-size: 75%;
	background-repeat: no-repeat;
	border-radius: 10px;
}

.control:active, .pressed {
	box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.65);
}

.control:not(#bomb) {
	position: absolute;
	background-color: grey;
}

#up {
	top: 0;
	left: 33.3333%;
	background-image: url('/img/up.png');
	background-position: center bottom;
}

#left {
	left: 0;
	top: 33.3333%;
	background-image: url('/img/left.png');
	background-position: right center;
}

#right {
	right: 0;
	top: 33.3333%;
	background-image: url('/img/right.png');
	background-position: left center;
}

#down {
	bottom: 0;
	left: 33.3333%;
	background-image: url('/img/down.png');
	background-position: center top;
}

#up,
#down {
	background-size: 25%;
}

/* Device-specific sizing */

/* Require landscape where possible */
@media screen and (orientation: portrait) {
	.size-warning {
		display: block;
	}

	.movement,
	#bomb {
		display: none;
	}
}

/* Classic iPhone and up */
@media screen and (min-width: 480px) {
	.movement {
		height: 240px;
		width: 240px;
		margin-top: -120px;
	}
	.movement .control {
		width: 80px;
		height: 80px;
	}
}

/* iPhone 6 and up */
@media screen and (min-width: 667px) {
	.movement {
		height: 300px;
		width: 300px;
		margin-top: -150px;
	}
	.movement .control {
		width: 100px;
		height: 100px;
	}
}