

.scroll3D .txt{position: absolute; right:5%; top: 50%; width: 30%; transform: translateY(calc(-50% - 100vh))}
  .scroll3D, .scroll3D>.bg_choice{max-width: 100% !important; padding: 0 !important; margin: 0 !important}
    .scroll3D .fullH{min-height: 100vh; max-width: 100% !important;perspective: 600px;perspective-origin: center center; overflow:hidden }

.scroll3D>.bg_choice>.fullH.odd.animDone>.txt{animation: S3DappearTxt 1s linear infinite; animation-play-state: paused; animation-delay: calc(var(--scrollfullHS3DOdd) * -1s) ; animation-iteration-count: 1; animation-fill-mode: forwards;}
.scroll3D>.bg_choice>.fullH.even.animDone>.txt{animation: S3DappearTxt 1s linear infinite; animation-play-state: paused; animation-delay: calc(var(--scrollfullHS3DEven) * -1s) ; animation-iteration-count: 1; animation-fill-mode: forwards;}



@keyframes S3DappearTxt{
  0%{opacity: 0; transform: translateY(calc(-50% - 100vh));}

  25%{opacity: 0;}
  40%{transform: translateY(calc(-50%)); opacity: 1}
  60%{transform: translateY(calc(-50%)); opacity: 1;}
  75%{opacity: 0;}

  100%{opacity: 0;transform: translateY(calc(-50% + 100vh));}
}


.scroll3D>.bg_choice>.fullH>.backgroundWrapper{overflow: hidden; padding-bottom:70vh; margin-top: 15vh; margin-bottom: 15vh; transform-style: preserve-3d;width: 65%; transform:rotateY(40deg); transform-origin: left center}

.scroll3D>.bg_choice>.fullH.odd.animDone>.backgroundWrapper{animation: S3Drotate3D 1s linear infinite; animation-play-state: paused; animation-delay: calc(var(--scrollfullHS3DOdd) * -1s) ; animation-iteration-count: 1; animation-fill-mode: forwards;}
.scroll3D>.bg_choice>.fullH.even.animDone>.backgroundWrapper{animation: S3Drotate3D 1s linear infinite; animation-play-state: paused; animation-delay: calc(var(--scrollfullHS3DEven) * -1s) ; animation-iteration-count: 1; animation-fill-mode: forwards;}


@keyframes S3Drotate3D{
  0%{transform: rotateY(45deg);}
  40%{transform: rotateY(17deg)}
  60%{transform: rotateY(12deg)}
  100%{transform: rotateY(5deg)}
}


.scroll3D>.bg_choice>.fullH>.backgroundWrapper::after{ content: ""; display: block;position: absolute; top: 0;right: 0;height: 100%; width: 15%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);mix-blend-mode: plus-lighter;
  opacity: 0.5;}
.scroll3D>.bg_choice>.fullH.odd.animDone>.backgroundWrapper::after{animation: S3Dhalotof 1s linear infinite; animation-play-state: paused; animation-delay: calc(var(--scrollfullHS3DOdd) * -1s) ; animation-iteration-count: 1; animation-fill-mode: forwards;}
.scroll3D>.bg_choice>.fullH.even.animDone>.backgroundWrapper::after{animation: S3Dhalotof 1s linear infinite; animation-play-state: paused; animation-delay: calc(var(--scrollfullHS3DEven) * -1s) ; animation-iteration-count: 1; animation-fill-mode: forwards;}


@keyframes S3Dhalotof{
  0%{transform: translateX(0);}
  40%{transform: translateX(-312%);}
  60%{transform: translateX(-468%);}
  100%{transform: translateX(-780%);}
}

.scroll3D>.bg_choice>.fullH.shapeChange[data-shape="1"]>.backgroundWrapper::after{animation-name: S3DhalotofBis}
.scroll3D>.bg_choice>.fullH.shapeChange[data-shape="1"]>.txt{position: absolute; right: auto !important;left:5%}
.scroll3D>.bg_choice>.fullH.shapeChange[data-shape="1"]>.backgroundWrapper{transform-origin: right center;animation-name:S3Drotate3DBis;position: absolute !important; right: 0; left: auto !important;}

@keyframes S3Drotate3DBis{
  0%{transform: rotateY(-45deg);}
  40%{transform: rotateY(-17deg)}
  60%{transform: rotateY(-12deg)}
  100%{transform: rotateY(-5deg)}
}
@keyframes S3DhalotofBis{
  0%{transform: translateX(-780%);}
  40%{transform: translateX(-468%);}
  60%{transform: translateX(-312%);}
  100%{transform: translateX(0);}
}

@media (max-width:800px){
  body .scroll3D>.bg_choice>.fullH>.backgroundWrapper{position: relative !important; right: auto !important; left:auto !important;  transform-origin: left center !important; animation-name:S3Drotate3D !important; margin-bottom: 5%; padding-bottom: 55vh}
  body .scroll3D>.bg_choice>.fullH>.txt{position: relative !important; width: 90%; top:auto; left:auto; right: auto; margin-left: 5%}
  @keyframes S3DappearTxt{
  0%{opacity: 0; transform: translateX(calc(-100% - 100vw));}

  
  50%{transform: translateX(calc(0%)); opacity: 1}
  80%{transform: translateX(calc(0%)); opacity: 1;}
 

  100%{opacity: 0;transform: translateX(calc(100% + 100vw));}
  }
  .scroll3D{margin-bottom: 5%}
}

