canvas {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
}

.scene-nav {
	font-size: 1.15em;
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	background: none;
	border: 0;
	right: 0;
	padding: 1.5em;
	color: var(--color-nav);
}

.scene-nav:focus {
	outline: none;
}

.scene-nav--prev {
	left: 0;
}

.slide-wrapper {
	display: none;
}

.icon--arrow-nav-next {
	transform: rotate(-180deg);
}

@media screen and (max-width: 765px) {

canvas {
    touch-action: none;
    object-fit: cover;
    width: 80%;
    height: 50% !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1) !important;
    cursor: inherit;
	}

}