html, body, .loading { height:100%; }
body, .loading {
	padding:0;
	margin:0;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none;
	-webkit-text-size-adjust:none;
	-moz-text-size-adjust:none;
	-ms-text-size-adjust:none;
	-o-text-size-adjust:none;
	text-size-adjust:none;
	font-family: sans-serif;
	font-size: 18px;
}
@media (min-width: 480px) { body { font-size: 14px; } }
@media (min-width: 640px) { body { font-size: 18px; } }
@media (min-width: 800px) { body { font-size: 22px; } }
@media (min-width: 1024px) { body { font-size: 29px; } }
@media (min-width: 1280px) { body { font-size: 36px; } }
@media (min-width: 1440px) { body { font-size: 40px; } }
@media (min-width: 1920px) { body { font-size: 54px; } }
@media (min-width: 2560px) { body { font-size: 72px; } }

.background {
    background-image: url(../img/background.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-color: black;
}
.background.dark {
	background-image: url(../img/background-dark.png);
}


.button {
	position: absolute;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

button.back {
	position: absolute; top: 1.5%; left: 1.5%; width: 7.8%; height: 15.3%;
    line-height: 1.5;

	border: none; outline: none; background-color: transparent;
	background-image: url(../img/button-back-up.png);
	background-size: 100% 100%;
    background-repeat: no-repeat;
}

button.back.down {
	background-image: url(../img/button-back-down.png);
}

/* SCENE */
#wrapper {
	width:100%;
	height:100%;
}

.pages {
    display: none;
}

.edge {
	text-align: right;
}

.page {
    height: 100%;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.sound {
    position: absolute;
    background-size: 100% 100%;
    background-repeat: no-repeat;
}