body{
	margin:0;
	padding:0;
	overflow-x:hidden;
	overflow-y:hidden;
}

.theater{
	position:relative;
	width:1000px;
	height:500px;
	margin:auto;
	border-style:solid;
	border-width:1px;
	overflow:hidden;
	/* margin:0; */
	image-rendering: smooth ;
	
}

.view, .skybox{
	width:100%;
	height:100%;
	position:relative;
	perspective-origin: 50% 50%;
}

.view *{
	box-sizing:border-box;
}

.world {

	left:0px;
	bottom:0px;
	width:100%;
	height:100%;
}

.wrap-object3d{
	position: absolute;
	left:0px;
	bottom:0px;
	transform-origin: center center 0px;
	transform-style: preserve-3d;
	margin:0;
	padding:0;
}

.wrap-object3d .rectangle{
	box-sizing:border-box;
}

.camera[active='true']{
	display:none;
}

.skybox{
	position:absolute;
	z-index:-10;
	top:0;
	left:0;
}

@keyframes playX {
	100%{ background-position-x: 0; }
}
@keyframes playY {
	100%{ background-position-y: 0; }
}
@keyframes playXY {
	100%{ background-position: 0 0; }
}

.sprite{
	
}