body{
	background-color: #eee
}

.content-wrapper{

	position:relative;
	top:2%;
	left:0%;
	margin-left:0%;
	margin-top:0%;
	width:90vw;
	height:50vw;
}

.img-note{
	position:absolute;
	margin:0px 0px;
	right:4.5vw;
	top:0.5vw;
	width:15vw;
	height:auto;
	pointer-events: none;

}
.img-beta{
	position:absolute;
	margin:0px 0px;
	right:37vw;
	top:2vw;
	width:10vw;
	height:auto;
	pointer-events: none;
}

.img-limited{
	position:absolute;
	margin:0px 0px;
	right:20vw;
	top:7vw;
	width:20vw;
	height:auto;
	pointer-events: none;
	z-index: 3;
}



.main-title{

	position:relative;
	top:5%;
	left:0%;
	margin-left:0vw;
	margin-top:0%;
	
	height:17vw;
	width:60vw;

}

.main-title img{
	position:absolute;
	top:0%;
	left:50%;
	margin-left:-40%;
	width:70%;
	height:auto;
}

.examples-wrapper{

	position:absolute;
	bottom:10%;
	left:50%;
	margin-left:-35vw;
	margin-top:0%;
	height:55%;
	width:70vw;
	border-radius: 1vw 1vw 1vw 1vw;
	overflow: hidden;
}

.example{
	position:absolute;
	height:50%;
	width:33.33%;
	/*border:0.4vw solid #eee;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.4);
	/*border-radius: 0.5vw 0.5vw 0.5vw 0.5vw;*/
	overflow: hidden;


}

.example.one{
	top:0%;
	left:0%;
	background-color: #aaa;
	/*border-radius: 1vw 1vw 1vw 1vw;*/

}

.example.two{
	top:0%;
	left:50%;
	margin-left:-16.7%;
	/*border-radius: 1vw 1vw 1vw 1vw;*/
	overflow: hidden;

}

.example.three{
	top:0%;
	right:0%;
	/*border-radius: 1vw 1vw 1vw 1vw;*/
}

.example.four{
	bottom:0%;
	left:0%;
	/*border-radius: 1vw 1vw 1vw 1vw;*/

}

.example.five{
	bottom:0%;
	left:50%;
	margin-left:-16.7%;
	/*border-radius: 1vw 1vw 1vw 1vw;*/
}

.example.six{
	bottom:0%;
	right:0%;
	/*border-radius: 1vw 1vw 1vw 1vw;*/
}

.example iframe{
	position:absolute;
	margin:0px;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	overflow: hidden;
	border:none;
}

#scene{
	display:none;
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
}

#play{
	display:none;
	position:absolute;
	top:50%;
	left:50%;
	width:20%;
	height:auto;
	margin-left:-10%;
	margin-top:-10%;
	cursor:pointer;
}

#pause{
	display:none;
	position:absolute;
	top:7vw;
	right:7vw;
	width:10%;
	height:auto;
	margin-right:-5vw;
	margin-top:-5vw;
	cursor:pointer;
}

#scene.is-visible{
	display:block;
}

#play.is-visible{
	display:block;
}

#pause.is-visible{
	display:block;
}

h1{

	position:absolute;
	margin:0px 0px;
	bottom:0px;
	font-size:1.6vw;
	font-family: roboto;

}

.text1{
	margin-left:-40%;
	top: 95%;
	left: 50%;
}


.notice-img{
	height:auto;
	width:auto;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.4);

}

.notice-img.one{
	max-width:20vw;
	max-height:auto;

}

.notice-img.two{
	max-width:30vw;
	max-height:auto;

}

.notice-img.three{
	max-width:30vw;
	max-height:auto;

}
