body {
	margin:0;
	padding:0;
	background-color:#8AD44F; /* grass color */
	font-family:sans-serif;
}
img {
	user-select:none;
	image-rendering: auto;
}
#infoHeaderID, #musicInfoHeaderID {
	position:fixed;
	left:50%;
	transform:translate(-50%,0);
	text-align:center;
	border-radius:6px;
	font-size:16px;
	border:2px solid black;
	box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.3);
	background-color:#00a1e6;
	color:white;
  
}
#musicInfoHeaderID {
  padding-left:20px;
  padding-right:20px;
}
#infoHeaderID {
	width:80%;
	min-width:180px;
	max-width:240px;
	height:22px;
	top:6px;
	z-index:3;
}
.buttonOnInfoHeader {
	background-color:transparent;
	border:none;
	color:white;
	text-shadow:1.5px 1.5px 1.5px #000000;
	padding:2px;
	cursor:pointer;
}
#musicInfoHeaderID {
	width:260px;
	text-shadow:1.8px 1.8px 1.5px #000000;
	bottom:calc(30px + 10vh);
	z-index:-1;
	opacity:0;
}
#musicInfoHeaderID.snapIn {
	opacity:100;
	z-index:20000;
}
#musicInfoHeaderID.fadeOut {
	opacity:0;
	z-index:-1;
}
.lot {
	margin:0 auto;
	position:relative;
}
#faderID {
	opacity:0;
	position:fixed;
	top:-50%;
	left:-50%;
	min-width:400%;
	min-height:400%;
	transition:0.4s;
	z-index:-1;
}
#faderID.fadeIn {
	opacity:0.85;
	z-index:1000;
}
#faderID.fadeOut {
	opacity:0;
	z-index:-1;
}
#loadingID {
	position:fixed;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	transition:1s;
	z-index:1010;
}
#loadingID.fadeOut {
	opacity:0;
	z-index:-2;
}
.houseOnMap {
	position:absolute;
	cursor:pointer;
	z-index:2;
}
.housePopup {
	position:fixed;
	top:-200%;
	left:50%;
	transform:translate(-50%, 0);
	width:80%;
	transition:0.8s;
	z-index:1001;
}
.housePopup.show {top:1vh;}
.housePopup.hide {top:-200%;}

.menuPopup {
	text-align:center;
	position:fixed;
	bottom:-200%;
	left:50%;
	transform:translate(-50%, 0);
	background-color:#FFFFFF;
	box-shadow:0px 8px 16px 0px rgba(0,0,0,0.5);
	transition:0.8s;
	z-index:1002;
	border-radius:12px;
	border:2px solid black;
	width:66%;
	min-width:200px;
	max-width:calc(220px + 8vh);
	padding:calc(1px + .8vh);
	font-size:calc(4px + 2vh);
}
.menuPopup p {margin:0.6vh;}
.menuPopup.show {bottom:calc(4px + 2vh);}
.menuPopup.hide {bottom:-200%;}
.menuPopup.showWithoutHouse {bottom:calc(4px + 4vh);}
.menuSmallText {font-size:calc(6px + 1vh);}

#kreum_menuPopupID{
	max-width:calc(300px + 6vh);
}

.buttonVirtualTour, .buttonClose, .buttonDontShowAgain {
	color:white;
	border-radius:8px;
	padding:calc(1px + 1vh) calc(2px + 1.6vh);
	font-size:calc(4px + 1.6vh);
	cursor:pointer;
	margin:0.4vh;
}
.buttonVirtualTour, .buttonDontShowAgain {
	background-color:#000A64;
}
.buttonClose {
	background-color:#a50000;
}
.menuText {
	line-height:calc(4px + 2.5vh);
}
#menuTextHowToMiniID {
	font-size:calc(5px + 1vh);
	margin:0.5vh;
	color:red;
	text-shadow:0px 0px 6px yellow;
}
#kreumLogoInMenuID {
	transform:translate(3%, 0);
	width:calc(40px + 28vh);
}
#tnLogoInMenuID {width:calc(6px + 28vh);}
#kreumLogoInMenuID, #tnLogoInMenuID {max-width:350px;}
.circularButtonContainer {
	position:fixed;
	z-index:3;
	bottom:2px;
}
.zoomInButtonContainer {right:4px;}
.zoomOutButtonContainer {right:calc(14px + 14vmin);}
#musicIsOnContainerID, #musicIsOffContainerID {
	position:fixed;
	z-index:3;
	bottom:2px;
	right:calc(28px + 28vmin);
}
#musicIsOnContainerID.center, #musicIsOffContainerID.center {
	left:50%;
	transform:translate(-50%,0);
}
#kreumButtonContainerID {left:calc(14px + 14vmin);}
#tnButtonContainerID {left:4px;}
.circularButtonImage { 
	width:calc(12px + 12vmin); 
	z-index:3;
}