:root{
	--room_width: 1280px;
	--room_height: 802px;
	--room_header: 73px;
	--room_scale:   1;
	--room_scale_header:   1;
	--bildinfo_width:  600px;
	--bildinfo_height: 400px;
	--show_header: unset;
	--room_plane_visible: visible;
}
body,html{
	height:100vh;
	width:100vw;
	margin:0;
	overflow:hidden;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;              /* RWI: verhindern des Drag Modus */
}
.cf {
	width: 100vw;
	display: flex;
    justify-content: space-between;
	flex-wrap: nowrap;
}
.view-header-scale {
	transform-origin: 0px 0px;
	transform: scale(var(--room_scale_header));
}
.cfl {
	/*display: grid;*/
	/*grid-area: rcfl;*/
	/*justify-self: flex-start;*/
	/*width: 494px;*/
	width: calc(var(--room_scale_header)*310px);
    /*height: 73px;*/
	/*justify-content: left;*/
	/*transform-origin: 0px 0px;*/
	/*transform: scale(var(--room_scale));*/
	display: var(--show_header);
}
.cfr {
	/*display: grid;*/
	/*grid-area: rcfr;*/
	/*justify-self: flex-end;*/
	/*width: 493px;*/
	width: calc(var(--room_scale_header)*310px);
    /*height: 73px;*/
	/*justify-content: right;*/
	/*transform-origin: 0px 0px;*/
	/*transform: scale(var(--room_scale));*/
	display: var(--show_header);
}
.view-container {
  display: grid;
  grid-template-areas:
    'viewheader'
    'viewroom';
  grid-template-columns: auto;
  grid-template-rows: 	calc(var(--room_scale_header)*73px)
						auto;

  
  height:100vh;
  width:100vw;
		
  /*grid-gap: 0px;*/
  /*padding: 0px;*/
  /*margin: 0px;*/
} 
.vptd{
	width: 100vw;
	/*height: calc(100vh - (var(--room_scale)*var(--room_header)));*/
	/*height: calc(100vh - var(--room_header));*/
	/*height: calc(100vh - var(--room_scale_header)*73px);*/
}
.view-container > div {
  padding: 0px 0px;
}
.view-container-header {
  width: 100vw;
  display: grid;
  grid-area: viewheader;
  grid-template-areas:
    'rcfl  rartist roommap rinfo rspkri rspkri rcfr'
    'rcfl  rartist roommap rparm rspkra rinfba rcfr';
/*  grid-template-columns: auto 73px 120px 50px 50px auto;*/
  grid-template-columns:	calc(var(--room_scale_header)*494px)
							calc(var(--room_scale_header)*73px)
							calc(var(--room_scale_header)*120px)
							calc(var(--room_scale_header)*50px)
							calc(var(--room_scale_header)*40px)
							calc(var(--room_scale_header)*40px)
							calc(var(--room_scale_header)*493px);
  grid-template-rows: 		calc(var(--room_scale_header)*73px/2)
							calc(var(--room_scale_header)*73px/2);
  grid-gap: 0px;
  justify-content: center;

  /*padding: 0px; */
  /*margin: 0px;  */
  /*transform-origin: 0px 0px; */
  /*transform: scale(var(--room_scale)); */
  /*height: calc(var(--room_scale)*var(--room_header)); */
}
.view-container-room {
  display: grid;
  grid-area: viewroom;
  grid-template-areas:
	'rroom';
  grid-template-columns: 100vw;
		
  grid-gap: 0px;
  /*padding: 0px;*/
  /*margin: 0px;*/
}
.parmslider {
		  width: 90%;
}
.header	{ /*grid-area: rcfl;*/
		  display: grid;
		  /*height: 73px;*/
		  justify-self: center;
		  /*min-width: 30px;*/
		  /*grid-column-start: rcfl-start;*/
		  /*grid-column-end: rcfr-end;*/
		  grid-column: 1 / span 7;
		  grid-row: 1 / span 2;
		}
.artist	{ grid-area: rartist; 
		  display: grid;
		  height: 73px;
		  width: 73px;
		  justify-content: center;
		  /*justify-self: center;*/
		  /*align-items: center;*/
		  cursor: pointer;
		  background-color: #F8F2DD;
		}
.roommap{ grid-area: roommap; 
		  display: grid;
		  height: 73px;
		  width:   120px;
  		  cursor: pointer;
		  visibility: visible;
		  position: relative;
		  justify-content: center;
		  background-color: #F8F2DD;
		}
.skri	{ grid-area: rspkri; 
		  display: grid;
		  /*justify-self: center;*/
		  /*align-items: center;*/
		  height: 36.5px;
		  width: 80px;
		  justify-content: left;
		  align-items: center;
		  background-color: #F8F2DD;
		  /*cursor: pointer;*/
		}
.skra	{ grid-area: rspkra; 
		  display: grid;
		  /*justify-self: center;*/
		  /*align-items: center;*/
		  height: 36.5px;
		  width: 40px;
		  justify-content: left;
		  align-items: center;
		  background-color: #F8F2DD;
		  /*cursor: pointer;*/
		}
.infb 	{ grid-area: rinfba; 
		  display: grid;
		  /*justify-self: center;*/
		  /*align-items: center;*/
		  height: 36.5px;
		  width: 40px;
		  justify-content: center;
		  align-items: center;
		  background-color: #F8F2DD;
		  /*cursor: pointer;*/
		}
.info	{ grid-area: rinfo; 
		  display: grid;
		  /*justify-self: center;*/
		  /*align-items: center;*/
  		  cursor: pointer;
		  height: 36.5px;
		  width: 50px;
		  justify-content: center;
		  align-items: center;
		  background-color: #F8F2DD;
		}
.parm	{ grid-area: rparm; 
		  display: grid;
		  /*justify-self: center;*/
		  /*align-items: center;*/
  		  cursor: pointer;
		  height: 36.5px;
		  width: 50px;
		  justify-content: center;
		  align-items: center;
		  background-color: #F8F2DD;
		}
.room	{ grid-area: rroom;}
.show	{ grid-area: viewroom;
		  height: calc(100vh - var(--room_header));
		  width: 100vw;
}
.cfsX {object-fit: contain;}
.cfsN {object-fit: contain;visibility: hidden;}
.cfsO {object-fit: contain;visibility: hidden;}
.cfsW {object-fit: contain;visibility: hidden;}
.cfsS {object-fit: contain;visibility: hidden;}
}.artistimg { 
	visibility: visible;
	object-fit: none;
}
.infoimg { 
	visibility: visible;
	object-fit: none;
}
.infoflp { 
	visibility: hidden;
	object-fit: none;
}
.parmimg { 
  object-fit: none;
}
.speakerimgA { 
  /*object-fit: none;*/
  visibility: hidden;
  cursor: default;
}
.speakerimgI { 
  /*object-fit: none;*/
  visibility: hidden;
  cursor: default;
}
.roommapx { 
  width:   120px;
  height:   73px;
  display:inline-block;
  vertical-align: top;
  position: relative;
  visibility: hidden;
}
.roommapimg { 
  width: 100%;
  height: 100%;
  object-fit: none;
  object-position: center;
  border-width: 0px;
}
.compass { 
  width:   120px;
  height:   73px;
  display:inline-block;
  position: absolute;
  top: 0px ;
  left: 0px;
}
.viewport{
	position:relative;
	top: 0px;
	left: 50%;
	transform-origin: 0px 0px;
	transform: scale(var(--room_scale)) translate(-50%);
	overflow:hidden;
	width:  var(--room_width);
	height: var(--room_height);
	-webkit-perspective:650;
	-moz-perspective:650px;
	-ms-perspective:650px;
	perspective:650px;
	background: black;
	cursor: move;
}
.showContent{
	position:relative;
	top: 0px;
	left: 50%;
	transform-origin: 0px 0px;
	transform: scale(var(--room_scale)) translate(-50%);
	-webkit-transform: scale(var(--room_scale)) translate(-50%);
	-ms-transform: scale(var(--room_scale)) translate(-50%);
	-moz-transform: scale(var(--room_scale)) translate(-50%);
  	height: calc(var(--room_height) - 4px);
	width:  calc(var(--room_width)  - 4px);
	z-index: 1;
	visibility: hidden;
	border-width: 2px;
	border-color: black;
	border-style: solid;
}
.audiospeaker{
	position: absolute;
	top: 20px;
	left: 20px;
	/*right:0px;*/
	width: 150px;
	height: 150px;
	/*cursor: pointer;*/
	z-index: 50099;
}
.closewindow{
	position: absolute;
	top: 0px;
	right:0px;
	width: 30px;
	height: 30px;
	cursor: pointer;
	z-index: 50099;
}
.world{
	position:absolute;
	left:50%;
	top:50%;
	-webkit-transform-style:preserve-3d;
	-moz-transform-style:preserve-3d;
	-ms-transform-style:preserve-3d;
	transform-style:preserve-3d;
}
.plane{
	position:absolute;
	-webkit-transform-origin:0 0 0;
	-webkit-backface-visibility:hidden;
	-moz-transform-origin:0 0 0;
	-moz-backface-visibility:hidden;
	-ms-transform-origin:0 0 0;
	-ms-backface-visibility:hidden;
	backface-visibility:hidden;
	display: var(--room_plane_visible);
}
.planeNBR{
	position:absolute;
	-webkit-transform-origin:0 0 0;
	-webkit-backface-visibility:hidden;
	-moz-transform-origin:0 0 0;
	-moz-backface-visibility:hidden;
	-ms-transform-origin:0 0 0;
	-ms-backface-visibility:hidden;
	backface-visibility:hidden;
}
.planeObjX{
	position:absolute;
	-webkit-transform-origin:0 0 0;
	-webkit-backface-visibility:visible;
	-moz-transform-origin:0 0 0;
	-moz-backface-visibility:visible;
	-ms-transform-origin:0 0 0;
	-ms-backface-visibility:visible;
	backface-visibility:visible;
	display: var(--room_plane_visible);
}
.planeFloor{
	position:absolute;
	-webkit-transform-origin:0 0 0;
	-webkit-backface-visibility:hidden;
	-moz-transform-origin:0 0 0;
	-moz-backface-visibility:hidden;
	-ms-transform-origin:0 0 0;
	-ms-backface-visibility:hidden;
	backface-visibility:hidden;
}
.CursorBlock{
	top: var(--room_header);
	left: 50%;
	width: 100%;
	height: 100%;
	transform: translate(-50%);
	-webkit-transform: translate(-50%);
	-ms-transform: translate(-50%);
	-moz-transform: translate(-50%);
	position: absolute;
	visibility: hidden;
	border-width: 0px;
	border-color: black;
	border-style: solid;
	display: flex;
	z-index: 50050;
	cursor: wait;
	background-color: transparent;
	justify-content: center;
	align-items: center; 
	-webkit-display: flex;
	-webkit-justify-content: center;
	-webkit-align-items: center; 
	-moz-display: flex;
	-moz-justify-content: center;
	-moz-align-items: center; 
	-ms-display: flex;
	-ms-justify-content: center;
	-ms-align-items: center; 
}
.showBox{
	top: var(--room_header);
	left: 50%;
	width: calc(var(--room_width) - 4px);
	height: calc(var(--room_height) - 4px);
	/*transform: translate(-50%);*/
	transform-origin: 0px 0px;
	transform: scale(var(--room_scale)) translate(-50%);
	-webkit-transform: scale(var(--room_scale)) translate(-50%);
	-ms-transform: scale(var(--room_scale)) translate(-50%);
	-moz-transform: scale(var(--room_scale)) translate(-50%);
	
	/*-webkit-transform: translate(-50%);*/
	/*-ms-transform: translate(-50%);*/
	/*-moz-transform: translate(-50%);*/
	position: absolute;
	visibility: hidden;
	border-width: 2px;
	border-color: black;
	border-style: solid;
	display: flex;
	justify-content: center;
	align-items: end; 
	-webkit-display: flex;
	-webkit-justify-content: center;
	-webkit-align-items: end; 
	-moz-display: flex;
	-moz-justify-content: center;
	-moz-align-items: end; 
	-ms-display: flex;
	-ms-justify-content: center;
	-ms-align-items: end; 
}
.showMouseOver{
	top: var(--room_header);
	left: 50%;
	width: calc(var(--room_width) - 4px);
	height: calc(var(--room_height) - 4px);
	/*transform: translate(-50%);*/
	transform-origin: 0px 0px;
	transform: scale(var(--room_scale)) translate(-50%);
	-webkit-transform: scale(var(--room_scale)) translate(-50%);
	-ms-transform: scale(var(--room_scale)) translate(-50%);
	-moz-transform: scale(var(--room_scale)) translate(-50%);
	
	/*-webkit-transform: translate(-50%);*/
	/*-ms-transform: translate(-50%);*/
	/*-moz-transform: translate(-50%);*/
	position: absolute;
	visibility: hidden;
	border-width: 2px;
	border-color: black;
	border-style: solid;
	display: flex;
	justify-content: center;
	align-items: center; 
	-webkit-display: flex;
	-webkit-justify-content: center;
	-webkit-align-items: center; 
	-moz-display: flex;
	-moz-justify-content: center;
	-moz-align-items: center; 
	-ms-display: flex;
	-ms-justify-content: center;
	-ms-align-items: center; 
}
.showBoxBI{
	top: 50%;
	left: 50%;
	width: var(--bildinfo_width);
	height: var(--bildinfo_height);
	transform: translate(-50%, -50%);
	/*transform-origin: 0px 0px;*/
	/*transform: scale(var(--room_scale)) translate(-50%,-50%);*/
	/*transform: scale(var(--room_scale)) translate(-50%,-50%);*/
	/*transform: scale(var(--room_scale)) translate(-50%,-50%);*/
	/*transform: scale(var(--room_scale)) translate(-50%,-50%);*/
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	position: absolute;
	visibility: hidden;
	border-width: 2px;
	border-color: black;
	border-style: solid;
	display: flex;
	justify-content: center;
	align-items: center; 
	-webkit-display: flex;
	-webkit-justify-content: center;
	-webkit-align-items: center; 
	-moz-display: flex;
	-moz-justify-content: center;
	-moz-align-items: center; 
	-ms-display: flex;
	-ms-justify-content: center;
	-ms-align-items: center; 
}
.showBild{
	z-index: 50023;
	background-color: white;
}
.showMouseOverBild{
	z-index: 50083;
	background-color: rgba(255, 255, 255, 0.3);
	backdrop-filter: blur(3px);	
	/*background-color: white;*/
}
.showInfo{
	z-index: 50043;
	background-color: white;
}
.showHtml{
	z-index: 50073;
	/*background-color: white;*/
}
.showHtmlSrc{
	z-index: 50074;
	width: 100%;
	height: 100%;
}
.playVideo{
	height: 100%;
    width: 100%;
    background-color: grey;
	object-fit: fill;
}
.showVideo{
	z-index: 50063;
	background-color: white;
}
.showAudio{
	z-index: 50063;
	background-color: white;
	/*background-color: transparent;*/
	/*backdrop-filter: blur(5px);*/
}
.showVideoSrc{
	z-index: 50064;
	/*background-color: #333333;*/
	/*top: 0;*/
	/*left: 0;*/
	width: 100%;
	height: 100%;
}
.showAudioSrc{
	z-index: 50064;
	/*background-color: #fffea9;*/
	/*top: 0;*/
	/*left: 0;*/
	width: 100%;
	height: 100%;
}
.showAudioStill{
    background-repeat: no-repeat;
    background-position-x: center;
    /*background-position-y: top;*/
    background-size: contain;	
}
.VideoOn{
	background-image: url("../MASTER_images/video-off.gif");
}
.VideoOff{
	background-image: url("../MASTER_images/video-on.gif");
}
.showInfoBI{
	z-index: 50053;
	background-color: white;
}
.showiframe{
	width: 100%;
	height: 100%;
	border: none;
}
.showBildBlock{
	z-index: 50024;
	background-color: transparent;
	cursor: pointer;
}
.showMouseOverlock{
	z-index: 50084;
	background-color: transparent;
	cursor: pointer;
}
.showInfoBlock{
	z-index: 50044;
	background-color: transparent;
	cursor: pointer;
}
.showInfoBlockBI{
	z-index: 50054;
	background-color: transparent;
	cursor: pointer;
}

.showBildsrc{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.showMouseOversrc{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.tourinfoT{
	font:12px/1.5 Tahoma,Arial;
	position:absolute;
	background:rgba(210,210,110,.7);
	z-index:50001}
#tourinfoT{bottom:140px;left:50%;width:360px;margin-left:-180px;text-align:center;font-size:120%;border-radius:7px;
}
.tourinfoS{
	font:12px/1.5 Tahoma,Arial;
	position:absolute;
	background:rgba(210,210,110,.7);
	z-index:50001}
#tourinfoS{bottom:100px;left:50%;width:360px;margin-left:-180px;text-align:center;font-size:120%;border-radius:7px;
}
.notice{
	font:12px/1.5 Tahoma,Arial;
	position:absolute;
	background:rgba(110,110,110,.7);
	z-index:50001}
#update{bottom:20px;left:50%;width:360px;margin-left:-180px;text-align:center;font-size:120%;border-radius:7px;
}
.msgbox{
	font:12px/1.5 Tahoma,Arial;
	position:absolute;
	background:rgba(110,110,110,.7);
	z-index:50002}
#msgbox{bottom:60px;left:50%;width:360px;margin-left:-180px;text-align:center;font-size:120%;border-radius:7px;
}
.errmsgtit{
	font:12px/1.5 Tahoma,Arial;
	position:absolute;
	background:rgba(110,110,110,.7);
	z-index:50003}
#errmsgtit{top:100px;left:10%;width:80%;text-align:center;font-size:120%;border-radius:7px;
}
.errmsgtxt{
	font:10px/1.0 Tahoma,Arial;
	position:absolute;
	background:rgba(110,110,110,.7);
	z-index:50004}
#errmsgtxt{top:150px;left:10%;width:80%;text-align:center;font-size:120%;border-radius:7px;}

.errhtml{
	top: 200px;
	left: 50%;
	width: 1276px;
	height: 671px;
	/*width: 1276px;*/
	/*height: 671px;*/
	width: calc(100vw - 44px);
	height: calc(62.65vw - 4px);
	max-height: calc(100vh - 97px);
	max-width: calc(159.60vh - 44px); 
	transform: translate(-50%);
	-webkit-transform: translate(-50%);
	-ms-transform: translate(-50%);
	-moz-transform: translate(-50%);
	position: absolute;
	visibility: visible;
	border-width: 5px;
	border-color: red;
	border-style: solid;
	display: flex;
	justify-content: center;
	align-items: center; 
	-webkit-display: flex;
	-webkit-justify-content: center;
	-webkit-align-items: center; 
	-moz-display: flex;
	-moz-justify-content: center;
	-moz-align-items: center; 
	-ms-display: flex;
	-ms-justify-content: center;
	-ms-align-items: center; 
	z-index: 50023;
	background-color: white;
}
.imgDoor{             /* for Animation Door */
	top: 0px;
	left:0px;
	width: 100%;
	height:100%;
	object-fit: cover;
	position: inherit;
}
.imgLift{             /* for Animation Lift */
	top: 0px;
	left:0px;
	width: 100%;
	height:100%;
	object-fit: cover;
	position: inherit;
}
.imgCollect{
	width: 200px;
	height:200px;
	object-fit: contain;
}
.imgBorder{
	border: 1px solid black;
}
.imgBGR{
	background-color: red;
}
.imgBGY{
	background-color: yellow;
}
.imgBGG{
	background-color: green;
}
.errorframe {
	display: none;
	z-index: 50073;
    visibility: hidden;
	background-color: rgba(255, 0, 0, 0.3);
	backdrop-filter: blur(3px);
}
.centerTXT {
	text-align: center;
}
.errorboard {
	background-image: url("../MASTER_images/Lift-Board.jpg");
	background-size: cover;
	/*background-repeat: round;*/
	position: absolute;
    height: 550px;
    width:  900px;
    z-index: 50073;
    visibility: hidden;
	padding: 30px;
    border-width: 2px;
    border-color: black;
    border-style: solid;
	display: grid;
	justify-content: center;
	align-items: center; 
	-webkit-display: flex;
	-webkit-justify-content: center;
	-webkit-align-items: center; 
	-moz-display: flex;
	-moz-justify-content: center;
	-moz-align-items: center; 
	-ms-display: flex;
	-ms-justify-content: center;
	-ms-align-items: center; 
}
.closeerror{
	position: absolute;
	top: 0px;
	right:10px;
	width: 30px;
	height: 30px;
	cursor: pointer;
	z-index: 50073;
}

.mouseoverinfo{
display: inline-flex;
    height: 300px;
    width: 300px;
    /*position: fixed;*/
    /*left: 400px;*/
    top: 73px;
	z-index: 50173;
	justify-content: center;
}
#World.dummy{}
#World.goCenter{
	/*animation: 1.5s cubic-bezier(0.8, 0, 0.2, 1) goCenter normal forwards;*/
	/*animation: 2s linear goCenter normal forwards;*/
	animation: var(--room_grTT) ease-in-out goCenter normal forwards;
}
@keyframes goCenter {
  to {
    transform-origin: calc(var(--room_grPX) * -1)
					  calc(var(--room_grPY) * -1)
					  calc(var(--room_grPZ) * -1);
	transform: translate3d(var(--room_grPX),
						   var(--room_grPY),
						   700px)
			   rotateX(var(--room_grRX))
			   rotateY(var(--room_grRY))
			   rotateZ(var(--room_grRZ));
  }
}


#World.turnAround{
	animation: var(--room_grTT) linear turnAround normal forwards;
}
@keyframes turnAround {
  to {
    transform-origin: calc(var(--room_grPX) * -1)
					  calc(var(--room_grPY) * -1)
					  calc(var(--room_grPZ) * -1);
	transform: translate3d(var(--room_grPX),
						   var(--room_grPY),
						   700px)
			   rotateX(var(--room_grRX))
			   rotateY(var(--room_grRY))
			   rotateZ(var(--room_grRZ));
  }
}
#World.turnCenter4x{
	animation: 15s linear turnCenter4x normal forwards;
}
@keyframes turnCenter4x {
  14%, 28% {
	transform: translate3d(  0px,
						     0px,
							 700px)
			   rotateX(270deg)
			   rotateY(0deg)
			   rotateZ(270deg);
  }
  42%, 57% {
	transform: translate3d(  0px,
						     0px,
							 700px)
			   rotateX(270deg)
			   rotateY(0deg)
			   rotateZ(360deg);
  }
  71% , 85% {
	transform: translate3d(  0px,
						     0px,
							 700px)
			   rotateX(270deg)
			   rotateY(0deg)
			   rotateZ(450deg);
  }
  100% {
	transform: translate3d(  0px,
						     0px,
							 700px)
			   rotateX(270deg)
			   rotateY(0deg)
			   rotateZ(540deg);
  }
}

#World.turnCenterx{
	animation: var(--room_grTT) linear turnCenterx normal forwards;
}
@keyframes turnCenterx {
  to {
    transform-origin: calc(var(--room_grPX) * -1)
					  calc(var(--room_grPY) * -1)
					  calc(var(--room_grPZ) * -1);
	transform: translate3d(var(--room_grPX),
						   var(--room_grPY),
						   700px)
			   rotateX(var(--room_grRX))
			   rotateY(var(--room_grRY))
			   rotateZ(var(--room_grRZ));
  }
}

#World.goPicture{
	/*animation: 1.5s cubic-bezier(0.8, 0, 0.2, 1) goPicture normal forwards;*/
	/*animation: 1.5s linear goPicture normal forwards;*/
	animation: var(--room_grTT) ease-in-out goPicture normal forwards;
}
@keyframes goPicture {
  to {
    transform-origin: calc(var(--room_grPX) * -1)
					  calc(var(--room_grPY) * -1)
					  calc(var(--room_grPZ) * -1);
	transform: translate3d(var(--room_grPX),
						   var(--room_grPY),
						   700px)
			   rotateX(var(--room_grRX))
			   rotateY(var(--room_grRY))
			   rotateZ(var(--room_grRZ));
  }
}	

.tmpFram{
	position: absolute;
	transform-style: preserve-3d;
	cursor: move;
}
#tmpFram.off {
	animation: 1.5s cubic-bezier(0.8, 0, 0.2, 1) closefram normal;
}
#tmpFram.on {
	animation: 1.5s cubic-bezier(0.8, 0, 0.2, 1) openfram normal;
}
@keyframes openfram {
  from {
    transform: translate3d(0px,0px,var(--room_framZ));
  }
  to {
    transform: translate3d(0px,0px,0px);
  }
}
@keyframes closefram {
  from {
    transform: translate3d(0px,0px,0px);
  }
  to {
    transform: translate3d(0px,0px,var(--room_framZ));
  }
}
/*#tmpFram {transition:all 0.3s linear;}*/
/*#tmpFram.on {transform: translate3d(0px,0px,0px);}*/

.imgText{
  font   : normal 40px sans-serif, Arial;
  fill: white;
  color: white;
  text-align: center;
  position: fixed;
  z-index: 50010;
  text-shadow: 0px 0px 10px #000,0px 0px 10px #000,0px 0px 10px #000;
  opacity: 0;
  display: none;
  margin: 0px;
}
.imgTextA{
  animation :  fadeinout 10s linear forwards;
  display: flex;
}
.imgTextAerr{
  animation :  fadeinout 10s linear forwards;
  display: flex;
  color: red;
}
@keyframes fadeinout {
  20% { opacity: 1; }
  80% { opacity: 1; }
}