/* CSS   was hier dazwischen steht ist auskommentiert	"style_node_scale.css"  */

body{
	background:#000;
	/*background-image: url("../images/background.png")*/;
	width:500000px;
	height:300000px;
	top: 0px;
	left: 0px;
	margin: 0;
	padding: 0;
	overflow-x: visible;
	overflow-y: visible;
	/*scroll-behavior: smooth;*/
}
body { -webkit-touch-callout: none !important; }
a { -webkit-user-select: none !important; }
body::-webkit-scrollbar {
	width: 2px;
	height: 2px;
	background-color: #000;
}
body::-webkit-scrollbar-thumb {
	background-color: #777;
}

/* ///////////////// layer for info(#foot) / #info_start / #info_homescreen  */
#foot {
	bottom: 0px;
	left:15px;
	width:1200px;
	height:150px;
	position: fixed;
	z-index: 2000;
	/*background-color: #fff000;*/
	background-color: rgb(0, 0, 0, 0.3);
	visibility: hidden; /* hidden - visible  ////////////////////////////   */
}
p {
	font-family: Helvetica;
	font-size: 18px;
	text-align: left;
	margin-top: 0px;
	color:#fff;
}



#info_fullscreen {
	top: 240px;
	left: 0px;
	width:320px;
	height:480px;
	position: fixed;
	z-index: 910;
	background-color: rgb(0, 0, 0, 0);
	visibility: hidden; /* hidden - visible  ////////////////////////////   */
}
#info_homescreen {
	top: 170px;
	left: 0px;
	width:260px;
	height:480px;
	position: fixed;
	z-index: 910;
	background-color: rgb(0, 0, 0, 0);
	visibility: hidden; /* hidden - visible  ////////////////////////////   */
}
#titel {
	top: 0px;
	left: 0px;
	height:100%;
	position: fixed;
	z-index: 300;
	background-color: rgb(0, 0, 0, 0);
	visibility: visible;
}

#btn_fullscreen{
	top: 12px;
	left: -1000px;
	width: 64px;
	height: 64px;
	position: fixed;
	z-index: 1000;
	visibility: visible; /* hidden - visible  ////////////////////////////   */
	background-color: rgba(0, 0, 0, 0);
	cursor:hand;
}
#btn_normscreen{
	top: 12px;
	left: -1000px;
	width:64px;
	height:64px;
	position: fixed;
	z-index: 998;
	visibility: hidden; /* hidden - visible  ////////////////////////////   */
	background-color: rgba(0, 0, 0, 0);
	cursor:hand;
}
#btn_showmenu {
	top: 12px;
	left: -1000px;
	width:64px;
	height:64px;
	position: fixed;
	z-index: 800;
	background-color: rgb(0, 0, 0, 0);
	visibility: visible; /* hidden - visible  ////////////////////////////   */
	cursor:hand;
}
#btn_showmenu_PC {
	top: 12px;
	left: 12px;
	width:64px;
	height:64px;
	position: fixed;
	z-index: 800;
	background-color: rgb(0, 0, 0, 0);
	visibility: visible; /* hidden - visible  ////////////////////////////   */
	cursor:hand;
}
#btn_start {
	top: 12px;
	left: 88px;
	width:128px;
	height:64px;
	position: fixed;
	z-index: 900;
	background-color: rgb(255, 255, 255, 0.0);
	visibility: visible; /* hidden - visible  ////////////////////////////   */
	cursor:hand;
}
/*
#btn_start_mob {
	top: 12px;
	left: 88px;
	width:64px;
	height:128px;
	position: fixed;
	z-index: 900;
	background-color: rgb(0, 0, 0, 0.9);
	visibility: hidden;
	cursor:hand;
}
*/
#btn_gotobegin {
	top: 12px;
	left: -1000px;
	width:64px;
	height:64px;
	position: fixed;
	z-index: 900;
	background-color: rgb(0, 0, 0, 0);
	visibility: hidden; /* hidden - visible  ////////////////////////////   */
	cursor:hand;
}
#btn_info {
	top: 288px;
	left: -1000px;
	width:64px;
	height:64px;
	position: fixed;
	z-index: 900;
	background-color: rgb(0, 0, 0, 1);
	visibility: visible; /* hidden - visible  ////////////////////////////   */
	cursor:hand;
}
#btn_info_mob {
	top: 12px;
	left: -100px;
	width:64px;
	height:64px;
	position: fixed;
	z-index: 900;
	background-color: rgb(0, 0, 0, 0);
	visibility: visible; /* hidden - visible  ////////////////////////////   */
	cursor:hand;
}





/* /////////////////////////////////////////////////// layer #layerScroll   */
/* /////////////////////////////////////////////////// layer #layerScroll   */
#layerScroll{
	top: 0px;
	left: 0px;
    height: 1000px;/* 100% vh scale(2,2) */
	position: fixed;
	z-index: 10;
	zoom: 1.0;
    -moz-transform: scale(1.0);
}
#layerFake{
	top: 0px;
	left: 0px;
	height: 300px;
	width: 300px;
	position: fixed;
	z-index: 500;
	background-color: rgb(0, 250, 0, 0);
	zoom: 1.0;
    -moz-transform: scale(1.0);
}



/* /////////////////////////////////////////////////// layer1 to layer10   */
/* /////////////////////////////////////////////////// layer1 to layer10   */
/* layer HORIZONTAL */
#layer1{
	top: 0px;
	left: 0px;
	height: 100%;
	position: relative;
	z-index: 10;
	background-color: #000;
}
/* layer VERTICAL */
#layer2{
	top: 0px;
	left: 111875px;
	width: 1400px;
	height: 10023px;
	position: relative;
	z-index: 100;
	background-color: #000;
}
/* layer HORIZONTAL 22000 ----------------------- */
#layer3{
	top: 0px;
	left: 111875px;
	height: 1000px;
	position: relative;
	z-index: 10;
	background-color: #000;
}
/* layer VERTICAL */
#layer4{
	top: 0px;
	left: 158886px;
	width: 1400px;
	height: 13685px;
	position: relative;
	z-index: 10;
	background-color: #000;
}
/* layer HORIZONTAL */
#layer5{
	top: 0px;
	left: 158886px;
	height: 1000px;
	position: relative;
	z-index: 10;
	background-color: #000;
}
/* layer VERTICAL */
#layer6{
	top: 0px;
	left: 365220px;
	width: 1400px;
	height: 4000px;
	position: relative;
	z-index: 10;
	background-color: #000;
}
/* layer HORIZONTAL */
#layer7{
	top: 0px;
	left: 39500px;
	height: 1000px;
	position: relative;
	z-index: 10;
	background-color: #000;
}
/* layer VERTICAL */
#layer8{
	top: 0px;
	left: 46000px;
	width: 1400px;
	height: 12000px;
	position: relative;
	z-index: 10;
	background-color: #000;
}
/* layer HORIZONTAL */
#layer9{
	top: 0px;
	left: 46000px;
	height: 1000px;
	position: relative;
	z-index: 10;
	background-color: #000;
}
/* layer VERTICAL */
#layer10{
	top: 0px;
	left: 80000px;
	width: 1400px;
	height: 3000px;
	position: relative;
	z-index: 10;
	background-color: #000fff;
}



/* /////////////////////////////////////////////////// other layer   */
/* /////////////////////////////////////////////////// other layer   */



@media only screen and (max-width: 896px){
#btn_start {
	width:96px;
	height:48px;
}
#btn_gotobegin {
	width:48px;
	height:48px;
}
#btn_showmenu {
	width:48px;
	height:48px;
}
#btn_info_mob {
	width:48px;
	height:48px;
}
#info_homescreen {
	top: 6px;
	left: 72px;
	width:220px;
}
}


/*
@media only screen and (max-width: 568px){
#btn_start_mobile {
	top: 30px;
	left: 30px;
	width:320px;
	height:160px;
}
#btn_gotobegin {
	top: 30px;
	left: 30px;
	width:160px;
	height:160px;
}
}
*/



/* /////////////////////////////////////////////////// for iPad / iPhone   */
/*
iphone 5 SE		568x320		16:9
iphone 6 7 8	667x375		16:9
iphone 6+7+8+	736x414		16:9

iphone XR		896x414		19.5:9
iphone X Xs		812x375		19.5:9
iphone Xs Max	896x414		19.5:9

ipad			1024x768	3:2.25
ipad pro 9.7	1024x768	3:2.25
ipad pro 10.5	1112x834	3:2.25
ipad pro 11		1194x834	3:2.1
ipad pro 12.9	1366x1024	3:2.25
*/


/*
@media only screen and (height: 1200px){
#layerScroll {
    -moz-transform: scale(1.2);
}
}

@media only screen and (max-height: 320px){
html {
    transform: rotate(-90deg);
    transform-origin: left top;
    width: 100vh;
    overflow-x: hidden;
    position: absolute;
    top: 100%;
    left: 0;
}
*/