displace sesame

css/sprint_4.css

@@ -14424,8 +14424,12 @@ responsive land
 
 @media all and (min-width: 1300px){
 
+	#hand{
+		top: 15vh;
+	}
 	#main_title{
 		top: 10vh;
+		min-height: 35vw;
 		max-width: 1300px;
 		max-height: 500px;
 	}

js/animations_custom.js

@@ -12,11 +12,14 @@ enable_animations = true
 const rotateYCard = '200deg'
 const offsetCard = '10'
 
-let innerWidth = window.innerWidth;
-document.onresize(event=> {
-	innerWidth = window.innerWidth;
+let innerWidth = window.innerWidth
+if (document.onresize) {
+
+	document.onresize(event => {
+		innerWidth = window.innerWidth
 		console.log('innerWidth', innerWidth)
-})
+	})
+}
 
 function animateCard (id, side) {
 
@@ -38,8 +41,8 @@ function animateCard (id, side) {
 			markers: development_debug,
 		}
 	}
-	fromObject[side] = 1;
-	toObject[side] = offsetCard;
+	fromObject[side] = 1
+	toObject[side] = offsetCard
 
 	gsap.fromTo('#content-' + id, fromObject,
 		toObject)
@@ -51,12 +54,12 @@ if (enable_animations) {
 	gsap.fromTo('#for_all_your', {
 			opacity: 0,
 			top: 100,
-			scale:0.5,
+			scale: 0.5,
 		},
 		{
 			opacity: 1,
-			top:0,
-			scale:1,
+			top: 0,
+			scale: 1,
 			duration: 0.25,
 			scrollTrigger: {
 				trigger: '#for_all_your',
@@ -65,12 +68,12 @@ if (enable_animations) {
 		})
 	gsap.fromTo('#for_all_your_2', {
 			opacity: 0,
-			scale:0.5,
+			scale: 0.5,
 		},
 		{
 			opacity: 1,
 			duration: 1,
-			scale:1,
+			scale: 1,
 			scrollTrigger: {
 				trigger: '#for_all_your_2',
 				delay: 0.4,
@@ -86,13 +89,11 @@ if (enable_animations) {
 			scrollTrigger: {
 				trigger: '#unlock_white',
 				delay: 1,
-				scrub:2,
+				scrub: 2,
 				start: '+50% 80%'
 			}
 		})
 
-
-
 	gsap.to('#main_title', {
 		delay: 1,
 		// xPercent: ()=>nav.offsetHeight,
@@ -219,7 +220,7 @@ if (enable_animations) {
 	gsap.fromTo('#content_all_img',
 		{
 			scale: 1,
-			left: "-100"
+			left: '-100'
 		},
 		{
 			scale: 1.1,