#page6 {
	
}

#page6 .background img{
	position: absolute;
	width: 100%;
	height: auto;
	top:0;
	right: 0;
}


#page6 .background .TopLeftBox{
	position: absolute;
	top:-368rem;
	left:0;
	width:100%;
	height: 368rem;
	background: var(--darkGrey);
	border-radius: 0 0 120rem 0;
}

#page6Logo {
	position: absolute;
	top: -10rem;
	right: 0;
	width: 268rem;
}

#page6 .textBlock .header{
	position: relative;
	top:-368rem;
}


#page6 .textBlock h4 {
	font-size: 20.3rem;
	display: block;
	padding: 30rem 0 0;
}

#page6 .textBlock h2{
	display: block;
	margin-top: 25rem;
	color: var(--orange);
}

#page6 .textBlock h2 span{
	color:#fff;
}

#page6 ul {
	margin-top: 120rem;
	width: 440rem;
	color: var(--darkGrey);
}

#page6 ul li {
	font-size: 18rem;
	opacity: 0;
}

#page6GeyFlag {
	background-color: var(--lightGrey);
	color: var(--darkGrey);
	width: 416rem;
	padding: 18rem 44rem;
	box-sizing: border-box;
	white-space: wrap;
	border-radius: 30rem 0;

	transform: scale(.9);
	opacity: 0;
	position: absolute;
	bottom:30rem;
}

#page6 #interactiveViewer {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 750rem;
	height: 590rem;
	z-index: 1;
}

/*#page6 #interactiveViewer.smoothScale{
	transition: all .25s cubic-bezier(0,.5,.25,1) !important;
}*/

#page6 #interactiveViewer .productName {
	position: absolute;
	left: 70rem;
	top: 50rem;
	color: var(--darkGrey);
	width: 80%;
}

#page6 #interactiveViewer .productName h3{
	font-size: 20rem;
}

#page6 #interactiveViewer .productName .instruction {
	font-size: 12rem;
	line-height: 1.5;
	padding-top: 1em;
}

#page6 #interactiveViewer.maximized {
	width: 100%;
	height: 100%;
	right:0;
}

#page6 #interactiveViewer iframe{
	width:100%;
	height: 100%;
	pointer-events: all;
	border: hidden;
}

#page6 #interactiveViewer{
	opacity: 0;
}

#page6 #maximizeViewer {
	position: absolute;
	top: 38rem;
	right: 73rem;
	width: 50rem !important;
	height: 50rem !important;
	cursor: pointer;
	z-index: 1;
	pointer-events: all;
	color: var(--orange);
	background: #fff;
	border: solid 10rem;
	font-size: 28rem;
	box-sizing: border-box;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 25rem;
	font-weight: 900;
	content: "+";
}

#page6 #interactiveViewer.maximized #maximizeViewer{
	transform: rotate(45deg);
}

#page6 .bottomRight{
	display: flex;
	gap: 14rem;
	right:75rem;
	bottom:90rem;
}

#page6 .expandedView{
	display: none;
}

#page6 #interactiveViewer.maximized .expandedView{
	display: inline-block;
}

/*-----------------------------------------------------------------*/
#page6.animate .background .TopLeftBox,#page6.animate .textBlock .header{
	top:0;
	transition: top .5s cubic-bezier(0,0,0,1);
	transition-delay: .25s;
}

#page6.animate li.a,#page6.animate li.b,#page6.animate li.c,#page6.animate li.d,#page6.animate li.e{
	opacity: 1;
	transition: opacity 1s linear;
}

#page6.animate li.a{
	transition-delay: .5s;
}
#page6.animate li.b{
	transition-delay: .6s;
}
#page6.animate li.c{
	transition-delay: .7s;
}
#page6.animate li.d{
	transition-delay: .8s;
}
#page6.animate li.e{
	transition-delay: .9s;
}

#page6.animate #page6GeyFlag{
	opacity: 1;
	transform: scale(1.0);
	bottom:0;
	transition: transform 1s cubic-bezier(0,.5,.25,1),bottom 1s cubic-bezier(0,.5,.25,1), opacity 1s linear;
	transition-delay: 1s;
}

#page6 #interactiveViewer.show{
	opacity: 1;
	transition: opacity 1s linear .5s;
}