#swapper-1 {
	width: 920px;
	height: 2220px;
}

#swapper-1 .interactive-swapper-image:first-child {
	margin-top: 70px;
}

@media (max-width: 920px) {
	#swapper-1 {
		width: 90vw;
		height: calc(2220 / 920 * 90vw);
	}
	
	#swapper-1 .interactive-swapper-image:first-child {
		margin-top: calc(70 / 920 * 90vw);
	}
	
	#swapper-1 .interactive-swapper-image:last-child {
		margin-left: calc(150 / 920 * 90vw);
	}
	
	#swapper-1 .interactive-swapper-image:first-child img {
		width: calc(614 / 920 * 90vw);
	}
	
	#swapper-1 .interactive-swapper-image:last-child img {
		width: calc(761 / 920 * 90vw);
	}
}



.noise-section {
    width: 1100px;
    height: 832px;
    position: relative;
    margin: auto;
}

.superscale-container {
	margin-bottom: 40px;
}

.hand-animation-container .superscale-container {
	width: 100% !important;
}

@media (max-width: 375px) {
	.superscale-container {
		margin-bottom: 20px;
	}
	
	.video_wrapper {
		margin-top: 20px;
		margin-bottom: 20px;
	}
	
	.hand-animation-container {
		margin-top: -80px;
	}
}

.noise-wrapper {
	position: absolute;
	background: url('bg-static.jpg') top center no-repeat;
    background-size: cover;
    width: 1047px;
	height: 726px;
    top: 65px;
    left: 29px;
    overflow: hidden;
}

.site-interface {
	width: 1100px;
	height: 832px;
	background: url('site-interface.png') no-repeat;
	position: absolute;
	z-index: 10;
}

.noise-section::before {
	content: '';
    display: block;
    background: rgba(0, 0, 0, 0.35);
    position: absolute;
    top: 65px;
    left: 29px;
    right: 24px;
    bottom: 41px;
    z-index: 1;
}

#noise-container {
    background: url('noise.gif');
    position: absolute;
    width: 1047px;
	height: 726px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    opacity: 0.04;
}
#particles-container {
    position: absolute;
    width: 120%;
	height: 120%;
    top: -10%;
    left: -10%;
    right: 0;
    bottom: 0;
    z-index: 0;
    overflow: hidden;
}

#static-particles-container {
    position: absolute;
    width: 120%;
	height: 120%;
    top: -10%;
    left: -10%;
    right: 0;
    bottom: 0;
    z-index: 0;
    overflow: hidden;
    transition: all 100ms linear;
    -moz-transition: all 100ms linear;
}

.hand-animation-wrapper {
	margin-top:60px;
	position: relative;
	width: 700px;
    height: 800px;

}

.page-company__astaxanthin-hand-animate {
    width: 700px;
    height: 240px;
    position: absolute;
    left: 0;
    bottom: 130px;
    /* opacity: 0.75; */
    z-index: -1;
    transform: scale(0.8);
    transform-origin: bottom left;
}

.page-company__astaxanthin-hand-animate-molecule {
    width: 650px;
    height: 650px;
    position: absolute;
    top: -540px;
    left: 60px;
    z-index: 1;
    animation-name: wave;
    animation-duration: 3500ms;
    animation-iteration-count: infinite;
    animation-timing-function: ease-out;
}

.page-company__astaxanthin-hand-animate-molecule div {
    width: 650px;
    height: 650px;
    background: url('solix-molecule.png') center no-repeat;
    animation-name: spin;
    animation-duration: 50s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.page-company__astaxanthin-hand-animate-hand {
    width: 700px;
    height: 240px;
    background: url('solix-hand.png') bottom left no-repeat;
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 2;
}


.interactive-scroller {
	width: 940px !important;
	height: 1050px !important;
}

.interactive-scroller-viewport {
	width: 421px !important;
	height: 746px !important;
	margin-top: 120px !important;
	margin-left: 32px !important;
}