@wix/design-system-illustrations 2.42.1 → 2.44.0

package/dist/cjs/animated/animated.global.css

@@ -1,3 +1,287 @@
+/* ElementPositionDefault */
+
+.ElementPositionDefault-root {
+  max-width: 100%;
+  height: auto;
+}
+
+.ElementPositionDefault-root {
+  --color-1: #002294;
+  --color-2: #B8C4FF;
+  --color-3: #D9D9D9;
+  --color-4: #ffffff;
+  --color-5: #F8F6F6;
+  --color-6: #EAEFFF;
+}
+
+.ElementPositionDefault-import-mvny2ub3-b {
+  transform-origin: 120.230499px 123.178547px;
+  animation: ElementPositionDefault-import-mvny2ub3-b-transform 3360ms linear infinite both;
+}
+
+@keyframes ElementPositionDefault-import-mvny2ub3-b-transform {
+  0% {
+    transform: translate(45px, 23px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  49.603175% {
+    transform: translate(45px, -107px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  99.206349% {
+    transform: translate(45px, 23px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  100% {
+    transform: translate(45px, 23px);
+  }
+}
+
+.ElementPositionDefault-node-2 {
+  transform-origin: 2px 12.970789px;
+  animation: ElementPositionDefault-node-2-transform 3360ms linear infinite both;
+}
+
+@keyframes ElementPositionDefault-node-2-transform {
+  0% {
+    transform: translate(0px, 0px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  49.603175% {
+    transform: translate(0px, 32px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  99.206349% {
+    transform: translate(0px, 0px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  100% {
+    transform: translate(0px, 0px);
+  }
+}
+    
+
+/* ElementPositionPinned */
+
+.ElementPositionPinned-root {
+  max-width: 100%;
+  height: auto;
+}
+
+.ElementPositionPinned-root {
+  --color-1: #002294;
+  --color-2: #B8C4FF;
+  --color-3: #D9D9D9;
+  --color-4: #ffffff;
+  --color-5: #F8F6F6;
+  --color-6: #EAEFFF;
+}
+
+.ElementPositionPinned-import-mvny2ub3-b {
+  transform-origin: 120.230499px 123.178547px;
+  animation: ElementPositionPinned-import-mvny2ub3-b-transform 3360ms linear infinite both;
+}
+
+@keyframes ElementPositionPinned-import-mvny2ub3-b-transform {
+  0% {
+    transform: translate(45px, 23px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  49.603175% {
+    transform: translate(45px, -107px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  99.206349% {
+    transform: translate(45px, 23px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  100% {
+    transform: translate(45px, 23px);
+  }
+}
+
+.ElementPositionPinned-node-2 {
+  transform-origin: 2px 12.970789px;
+  animation: ElementPositionPinned-node-2-transform 3360ms linear infinite both;
+}
+
+@keyframes ElementPositionPinned-node-2-transform {
+  0% {
+    transform: translate(0px, 0px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  49.603175% {
+    transform: translate(0px, 32px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  99.206349% {
+    transform: translate(0px, 0px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  100% {
+    transform: translate(0px, 0px);
+  }
+}
+    
+
+/* ElementPositionSticky */
+
+.ElementPositionSticky-root {
+  max-width: 100%;
+  height: auto;
+}
+
+.ElementPositionSticky-root {
+  --color-1: #002294;
+  --color-2: #B8C4FF;
+  --color-3: #D9D9D9;
+  --color-4: #ffffff;
+  --color-5: #F8F6F6;
+  --color-6: #EAEFFF;
+}
+
+.ElementPositionSticky-Icon-Container-2 {
+  transform-origin: 114.923px 36.560651px;
+  animation:
+    ElementPositionSticky-Icon-Container-2-transform 3360ms linear infinite both,
+    ElementPositionSticky-Icon-Container-2-opacity 3360ms linear infinite both;
+}
+
+@keyframes ElementPositionSticky-Icon-Container-2-transform {
+  0% {
+    transform: translate(46px, -5px);
+    animation-timing-function: steps(1, jump-end);
+  }
+  19.84127% {
+    transform: translate(46px, -7px);
+    animation-timing-function: steps(1, jump-end);
+  }
+  100% {
+    transform: translate(46px, -7px);
+  }
+}
+
+@keyframes ElementPositionSticky-Icon-Container-2-opacity {
+  0% {
+    opacity: 1;
+  }
+  19.85119% {
+    opacity: 1;
+  }
+  19.85219% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+
+.ElementPositionSticky-Icon-Container-2-2 {
+  transform-origin: 114.923px 36.560651px;
+  animation:
+    ElementPositionSticky-Icon-Container-2-2-transform 3360ms linear infinite both,
+    ElementPositionSticky-Icon-Container-2-2-opacity 3360ms linear infinite both;
+}
+
+@keyframes ElementPositionSticky-Icon-Container-2-2-transform {
+  0% {
+    transform: translate(1px, 10.027px);
+  }
+  19.84127% {
+    transform: translate(1px, 10.027px);
+  }
+  100% {
+    transform: translate(1px, 10.027px);
+  }
+}
+
+@keyframes ElementPositionSticky-Icon-Container-2-2-opacity {
+  0% {
+    opacity: 0;
+  }
+  19.85019% {
+    opacity: 0;
+  }
+  19.85119% {
+    opacity: 1;
+  }
+  73.154762% {
+    opacity: 1;
+  }
+  73.155762% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 0;
+  }
+}
+
+.ElementPositionSticky-Icon-Container-2-3 {
+  animation: ElementPositionSticky-Icon-Container-2-3-opacity 3360ms linear infinite both;
+}
+
+@keyframes ElementPositionSticky-Icon-Container-2-3-opacity {
+  0% {
+    opacity: 0;
+  }
+  73.153762% {
+    opacity: 0;
+  }
+  73.154762% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+.ElementPositionSticky-import-mvny2ub3-b {
+  transform-origin: 120.230499px 123.178547px;
+  animation: ElementPositionSticky-import-mvny2ub3-b-transform 3360ms linear infinite both;
+}
+
+@keyframes ElementPositionSticky-import-mvny2ub3-b-transform {
+  0% {
+    transform: translate(45px, 23px);
+    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
+  }
+  49.603175% {
+    transform: translate(45px, -107px);
+    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
+  }
+  99.206349% {
+    transform: translate(45px, 23px);
+    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
+  }
+  100% {
+    transform: translate(45px, 23px);
+  }
+}
+
+.ElementPositionSticky-node-2 {
+  transform-origin: 2px 12.970789px;
+  animation: ElementPositionSticky-node-2-transform 3360ms linear infinite both;
+}
+
+@keyframes ElementPositionSticky-node-2-transform {
+  0% {
+    transform: translate(0px, 0px);
+    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
+  }
+  49.603175% {
+    transform: translate(0px, 32px);
+    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
+  }
+  99.206349% {
+    transform: translate(0px, 0px);
+    animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1);
+  }
+  100% {
+    transform: translate(0px, 0px);
+  }
+}
+    
+
 /* ElementsFixedHeight */
 
 .ElementsFixedHeight-root {
@@ -1136,10 +1420,10 @@
 }
 
 .ResponsiveBehaviorElementsAutoHeight-node-6-shape {
-  animation: node-6-height 3333ms linear infinite both;
+  animation: ResponsiveBehaviorElementsAutoHeight-node-6-height 3333ms linear infinite both;
 }
 
-@keyframes node-6-height {
+@keyframes ResponsiveBehaviorElementsAutoHeight-node-6-height {
   0% {
     height: 56px;
     animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
@@ -1556,11 +1840,11 @@
 
 .ResponsiveBehaviorElementsRelativeWidth-node-7-3-shape {
   animation:
-    node-7-3-width 3375ms linear infinite both,
-    node-7-3-height 3375ms linear infinite both;
+    ResponsiveBehaviorElementsRelativeWidth-node-7-3-width 3375ms linear infinite both,
+    ResponsiveBehaviorElementsRelativeWidth-node-7-3-height 3375ms linear infinite both;
 }
 
-@keyframes node-7-3-width {
+@keyframes ResponsiveBehaviorElementsRelativeWidth-node-7-3-width {
   0% {
     width: 100px;
     animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
@@ -1570,7 +1854,7 @@
   }
 }
 
-@keyframes node-7-3-height {
+@keyframes ResponsiveBehaviorElementsRelativeWidth-node-7-3-height {
   0% {
     height: 58px;
     animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
@@ -3884,14 +4168,14 @@
 }
     
 
-/* ResponsiveBehaviorHeaderFadeOut */
+/* ResponsiveBehaviorHeaderDisappear */
 
-.ResponsiveBehaviorHeaderFadeOut-root {
+.ResponsiveBehaviorHeaderDisappear-root {
   max-width: 100%;
   height: auto;
 }
 
-.ResponsiveBehaviorHeaderFadeOut-root {
+.ResponsiveBehaviorHeaderDisappear-root {
   --color-1: #002294;
   --color-2: #B8C4FF;
   --color-3: #F8F6F6;
@@ -3899,37 +4183,75 @@
   --color-5: #303030;
 }
 
-.ResponsiveBehaviorHeaderFadeOut-Group-2147222209 {
-  animation: ResponsiveBehaviorHeaderFadeOut-Group-2147222209-opacity 3360ms linear infinite both;
+.ResponsiveBehaviorHeaderDisappear-Group-2147222209 {
+  animation: ResponsiveBehaviorHeaderDisappear-Group-2147222209-opacity 3360ms linear infinite both;
 }
 
-@keyframes ResponsiveBehaviorHeaderFadeOut-Group-2147222209-opacity {
+@keyframes ResponsiveBehaviorHeaderDisappear-Group-2147222209-opacity {
   0% {
     opacity: 1;
-    animation-timing-function: cubic-bezier(0.6, 0, 1, 1);
+    animation-timing-function: steps(1, jump-end);
   }
-  23.809524% {
+  19.84127% {
     opacity: 0;
+    animation-timing-function: steps(1, jump-end);
   }
-  71.428571% {
+  84.325397% {
     opacity: 0;
-    animation-timing-function: cubic-bezier(0, 0, 0.404119, 1);
+    animation-timing-function: steps(1, jump-end);
   }
   95.238095% {
     opacity: 1;
   }
+  95.486111% {
+    opacity: 1;
+    animation-timing-function: steps(1, jump-end);
+  }
   100% {
     opacity: 1;
   }
 }
 
-.ResponsiveBehaviorHeaderFadeOut-import-msvsnwyw-7 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ResponsiveBehaviorHeaderFadeOut-import-msvsnwyw-7-transform 3360ms linear infinite both;
+.ResponsiveBehaviorHeaderDisappear-Rectangle-4723343 {
+  animation: ResponsiveBehaviorHeaderDisappear-shared-opacity-1 3360ms linear infinite both;
 }
 
-@keyframes ResponsiveBehaviorHeaderFadeOut-import-msvsnwyw-7-transform {
+@keyframes ResponsiveBehaviorHeaderDisappear-shared-opacity-1 {
+  0% {
+    opacity: 1;
+    animation-timing-function: steps(1, jump-end);
+  }
+  19.84127% {
+    opacity: 0;
+    animation-timing-function: steps(1, jump-end);
+  }
+  84.325397% {
+    opacity: 0;
+    animation-timing-function: steps(1, jump-end);
+  }
+  95.486111% {
+    opacity: 1;
+    animation-timing-function: steps(1, jump-end);
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+.ResponsiveBehaviorHeaderDisappear-Rectangle-4723344 {
+  animation: ResponsiveBehaviorHeaderDisappear-shared-opacity-1 3360ms linear infinite both;
+}
+
+.ResponsiveBehaviorHeaderDisappear-Rectangle-4723345_2 {
+  animation: ResponsiveBehaviorHeaderDisappear-shared-opacity-1 3360ms linear infinite both;
+}
+
+.ResponsiveBehaviorHeaderDisappear-import-msvsnwyw-7 {
+  transform-origin: 169.18417px 59.362999px;
+  animation: ResponsiveBehaviorHeaderDisappear-import-msvsnwyw-7-transform 3360ms linear infinite both;
+}
+
+@keyframes ResponsiveBehaviorHeaderDisappear-import-msvsnwyw-7-transform {
   0% {
     transform: translate(41px, 23px);
     animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
@@ -3947,13 +4269,12 @@
   }
 }
 
-.ResponsiveBehaviorHeaderFadeOut-node-2-3 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ResponsiveBehaviorHeaderFadeOut-node-2-3-transform 3360ms linear infinite both;
+.ResponsiveBehaviorHeaderDisappear-node-2-3 {
+  transform-origin: 2px 12.97321px;
+  animation: ResponsiveBehaviorHeaderDisappear-node-2-3-transform 3360ms linear infinite both;
 }
 
-@keyframes ResponsiveBehaviorHeaderFadeOut-node-2-3-transform {
+@keyframes ResponsiveBehaviorHeaderDisappear-node-2-3-transform {
   0% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
@@ -3972,14 +4293,14 @@
 }
     
 
-/* ResponsiveBehaviorHeaderFreeze */
+/* ResponsiveBehaviorHeaderFadeOut */
 
-.ResponsiveBehaviorHeaderFreeze-root {
+.ResponsiveBehaviorHeaderFadeOut-root {
   max-width: 100%;
   height: auto;
 }
 
-.ResponsiveBehaviorHeaderFreeze-root {
+.ResponsiveBehaviorHeaderFadeOut-root {
   --color-1: #002294;
   --color-2: #B8C4FF;
   --color-3: #F8F6F6;
@@ -3987,20 +4308,108 @@
   --color-5: #303030;
 }
 
-.ResponsiveBehaviorHeaderFreeze-import-msvsnwyw-7 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ResponsiveBehaviorHeaderFreeze-import-msvsnwyw-7-transform 3360ms linear infinite both;
+.ResponsiveBehaviorHeaderFadeOut-Group-2147222209 {
+  animation: ResponsiveBehaviorHeaderFadeOut-Group-2147222209-opacity 3360ms linear infinite both;
 }
 
-@keyframes ResponsiveBehaviorHeaderFreeze-import-msvsnwyw-7-transform {
+@keyframes ResponsiveBehaviorHeaderFadeOut-Group-2147222209-opacity {
   0% {
-    transform: translate(41px, 23px);
-    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
-  }
-  50% {
-    transform: translate(41px, -106.4px);
-    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+    opacity: 1;
+    animation-timing-function: cubic-bezier(0.6, 0, 1, 1);
+  }
+  23.809524% {
+    opacity: 0;
+  }
+  71.428571% {
+    opacity: 0;
+    animation-timing-function: cubic-bezier(0, 0, 0.404119, 1);
+  }
+  95.238095% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+.ResponsiveBehaviorHeaderFadeOut-import-msvsnwyw-7 {
+  transform-box: fill-box;
+  transform-origin: 50% 50%;
+  animation: ResponsiveBehaviorHeaderFadeOut-import-msvsnwyw-7-transform 3360ms linear infinite both;
+}
+
+@keyframes ResponsiveBehaviorHeaderFadeOut-import-msvsnwyw-7-transform {
+  0% {
+    transform: translate(41px, 23px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  49.613095% {
+    transform: translate(41px, -106.4px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  95.238095% {
+    transform: translate(41px, 23px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  100% {
+    transform: translate(41px, 23px);
+  }
+}
+
+.ResponsiveBehaviorHeaderFadeOut-node-2-3 {
+  transform-box: fill-box;
+  transform-origin: 50% 50%;
+  animation: ResponsiveBehaviorHeaderFadeOut-node-2-3-transform 3360ms linear infinite both;
+}
+
+@keyframes ResponsiveBehaviorHeaderFadeOut-node-2-3-transform {
+  0% {
+    transform: translate(0px, 0px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  49.613095% {
+    transform: translate(0px, 31.965px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  95.238095% {
+    transform: translate(0px, 0px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  100% {
+    transform: translate(0px, 0px);
+  }
+}
+    
+
+/* ResponsiveBehaviorHeaderFreeze */
+
+.ResponsiveBehaviorHeaderFreeze-root {
+  max-width: 100%;
+  height: auto;
+}
+
+.ResponsiveBehaviorHeaderFreeze-root {
+  --color-1: #002294;
+  --color-2: #B8C4FF;
+  --color-3: #F8F6F6;
+  --color-4: #D9D9D9;
+  --color-5: #303030;
+}
+
+.ResponsiveBehaviorHeaderFreeze-import-msvsnwyw-7 {
+  transform-box: fill-box;
+  transform-origin: 50% 50%;
+  animation: ResponsiveBehaviorHeaderFreeze-import-msvsnwyw-7-transform 3360ms linear infinite both;
+}
+
+@keyframes ResponsiveBehaviorHeaderFreeze-import-msvsnwyw-7-transform {
+  0% {
+    transform: translate(41px, 23px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
+  }
+  50% {
+    transform: translate(41px, -106.4px);
+    animation-timing-function: cubic-bezier(0.8, 0, 0.2, 1);
   }
   98.809524% {
     transform: translate(41px, 23px);
@@ -6500,10 +6909,10 @@
 }
 
 .node-1-5 {
-  animation: node-1-5-opacity 3417ms linear infinite both;
+  animation: ResponsiveBehaviorWarp-node-1-5-opacity 3417ms linear infinite both;
 }
 
-@keyframes node-1-5-opacity {
+@keyframes ResponsiveBehaviorWarp-node-1-5-opacity {
   0% {
     opacity: 1;
   }
@@ -7413,31 +7822,34 @@
 }
     
 
-/* ThumbnailFullWidth */
+/* StickySectionPresetsFullWidth */
 
-.ThumbnailFullWidth-root {
+.StickySectionPresetsFullWidth-root {
   max-width: 100%;
   height: auto;
 }
 
-.ThumbnailFullWidth-root {
+.StickySectionPresetsFullWidth-root *, .StickySectionPresetsFullWidth-root *::before, .StickySectionPresetsFullWidth-root *::after { animation-delay: -1700ms !important; }
+
+.StickySectionPresetsFullWidth-root {
   --color-1: #F8F6F6;
   --color-2: #002294;
   --color-3: #7896FF;
 }
 
-.ThumbnailFullWidth-Frame-1707483277 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailFullWidth-Frame-1707483277-transform 2375ms linear infinite both;
+.StickySectionPresetsFullWidth-Frame-1707483277 {
+  transform-origin: 44.431254px 42.9419px;
+  animation:
+    StickySectionPresetsFullWidth-Frame-1707483277-transform 2417ms linear infinite both,
+    StickySectionPresetsFullWidth-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailFullWidth-Frame-1707483277-transform {
+@keyframes StickySectionPresetsFullWidth-Frame-1707483277-transform {
   0% {
-    transform: translate(0px, 57.591696px);
+    transform: translate(0px, 58.340508px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  40.336842% {
+  41.373604% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7446,72 +7858,34 @@
   }
 }
 
-.ThumbnailFullWidth-Frame-1707483278 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailFullWidth-Frame-1707483278-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailFullWidth-Frame-1707483278-transform {
+@keyframes StickySectionPresetsFullWidth-shared-opacity-1 {
   0% {
-    transform: translate(0px, 51.778772px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  33.347368% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  100% {
-    transform: translate(0px, 0px);
+    opacity: 0;
   }
-}
-
-.ThumbnailFullWidth-Frame-1707483281 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailFullWidth-Frame-1707483281-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailFullWidth-Frame-1707483281-transform {
-  0% {
-    transform: translate(0px, 30px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.736691% {
+    opacity: 0;
   }
-  26.315789% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.737691% {
+    opacity: 1;
   }
   100% {
-    transform: translate(0px, 0px);
+    opacity: 1;
   }
 }
-    
-
-/* ThumbnailFullWidthTransparent */
 
-.ThumbnailFullWidthTransparent-root {
-  max-width: 100%;
-  height: auto;
-}
-
-.ThumbnailFullWidthTransparent-root {
-  --color-1: #F8F6F6;
-  --color-2: #002294;
-  --color-3: #7896FF;
-}
-
-.ThumbnailFullWidthTransparent-Frame-1707483277 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailFullWidthTransparent-Frame-1707483277-transform 2375ms linear infinite both;
+.StickySectionPresetsFullWidth-Frame-1707483278 {
+  transform-origin: 34px 34px;
+  animation:
+    StickySectionPresetsFullWidth-Frame-1707483278-transform 2417ms linear infinite both,
+    StickySectionPresetsFullWidth-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailFullWidthTransparent-Frame-1707483277-transform {
+@keyframes StickySectionPresetsFullWidth-Frame-1707483278-transform {
   0% {
-    transform: translate(0px, 57.591696px);
+    transform: translate(0px, 53.865117px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  40.336842% {
+  34.505585% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7520,18 +7894,19 @@
   }
 }
 
-.ThumbnailFullWidthTransparent-Frame-1707483278 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailFullWidthTransparent-Frame-1707483278-transform 2375ms linear infinite both;
+.StickySectionPresetsFullWidth-Frame-1707483281 {
+  transform-origin: 34px 24px;
+  animation:
+    StickySectionPresetsFullWidth-Frame-1707483281-transform 2417ms linear infinite both,
+    StickySectionPresetsFullWidth-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailFullWidthTransparent-Frame-1707483278-transform {
+@keyframes StickySectionPresetsFullWidth-Frame-1707483281-transform {
   0% {
-    transform: translate(0px, 51.778772px);
+    transform: translate(0px, 39.094881px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  33.347368% {
+  27.596194% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7540,92 +7915,73 @@
   }
 }
 
-.ThumbnailFullWidthTransparent-Frame-1707483281 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailFullWidthTransparent-Frame-1707483281-transform 2375ms linear infinite both;
+.StickySectionPresetsFullWidth-fullwidth_new-2 {
+  animation: StickySectionPresetsFullWidth-fullwidth_new-2-opacity 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailFullWidthTransparent-Frame-1707483281-transform {
+@keyframes StickySectionPresetsFullWidth-fullwidth_new-2-opacity {
   0% {
-    transform: translate(0px, 30px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+    opacity: 1;
   }
-  26.315789% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.737691% {
+    opacity: 1;
+  }
+  1.738691% {
+    opacity: 0;
   }
   100% {
-    transform: translate(0px, 0px);
+    opacity: 0;
   }
 }
     
 
-/* ThumbnailGrid */
+/* StickySectionPresetsGridRows */
 
-.ThumbnailGrid-root {
+.StickySectionPresetsGridRows-root {
   max-width: 100%;
   height: auto;
 }
 
-.ThumbnailGrid-root {
-  --color-1: #F8F6F6;
+.StickySectionPresetsGridRows-root *, .StickySectionPresetsGridRows-root *::before, .StickySectionPresetsGridRows-root *::after { animation-delay: -1700ms !important; }
+
+.StickySectionPresetsGridRows-root {
+  --color-1: #7896FF;
   --color-2: #002294;
-  --color-3: #7896FF;
+  --color-3: #F8F6F6;
 }
 
-.ThumbnailGrid-Group-2147222318 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailGrid-Group-2147222318-transform 2375ms linear infinite both;
+.StickySectionPresetsGridRows-Thumbnail-Container-2 {
+  animation: StickySectionPresetsGridRows-Thumbnail-Container-2-opacity 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailGrid-Group-2147222318-transform {
+@keyframes StickySectionPresetsGridRows-Thumbnail-Container-2-opacity {
   0% {
-    transform: translate(0px, 30px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  26.315789% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  100% {
-    transform: translate(0px, 0px);
+    opacity: 1;
   }
-}
-
-.ThumbnailGrid-Group-2147222319 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailGrid-Group-2147222319-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailGrid-Group-2147222319-transform {
-  0% {
-    transform: translate(0px, 51.778772px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.737691% {
+    opacity: 1;
   }
-  33.347368% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.738691% {
+    opacity: 0;
   }
   100% {
-    transform: translate(0px, 0px);
+    opacity: 0;
   }
 }
 
-.ThumbnailGrid-Group-2147222320 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailGrid-Group-2147222320-transform 2375ms linear infinite both;
+.StickySectionPresetsGridRows-group-mtr8nkm4-1 {
+  transform-origin: 33.99795px 24.154449px;
+  animation:
+    StickySectionPresetsGridRows-group-mtr8nkm4-1-transform 2417ms linear infinite both,
+    StickySectionPresetsGridRows-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailGrid-Group-2147222320-transform {
+@keyframes StickySectionPresetsGridRows-group-mtr8nkm4-1-transform {
   0% {
-    transform: translate(0px, 57.591696px);
+    transform: translate(0px, 39.094881px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  40.336842% {
+  27.596194% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7633,53 +7989,35 @@
     transform: translate(0px, 0px);
   }
 }
-    
-
-/* ThumbnailGridTransparent */
 
-.ThumbnailGridTransparent-root {
-  max-width: 100%;
-  height: auto;
-}
-
-.ThumbnailGridTransparent-root {
-  --color-1: #F8F6F6;
-  --color-2: #002294;
-  --color-3: #7896FF;
-}
-
-.ThumbnailGridTransparent-Group-2147222318 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailGridTransparent-Group-2147222318-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailGridTransparent-Group-2147222318-transform {
+@keyframes StickySectionPresetsGridRows-shared-opacity-1 {
   0% {
-    transform: translate(0px, 30px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+    opacity: 0;
   }
-  26.315789% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.736691% {
+    opacity: 0;
+  }
+  1.737691% {
+    opacity: 1;
   }
   100% {
-    transform: translate(0px, 0px);
+    opacity: 1;
   }
 }
 
-.ThumbnailGridTransparent-Group-2147222319 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailGridTransparent-Group-2147222319-transform 2375ms linear infinite both;
+.StickySectionPresetsGridRows-group-mtr8o0p7-2 {
+  transform-origin: 33.99795px 33.99815px;
+  animation:
+    StickySectionPresetsGridRows-group-mtr8o0p7-2-transform 2417ms linear infinite both,
+    StickySectionPresetsGridRows-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailGridTransparent-Group-2147222319-transform {
+@keyframes StickySectionPresetsGridRows-group-mtr8o0p7-2-transform {
   0% {
-    transform: translate(0px, 51.778772px);
+    transform: translate(0px, 53.865117px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  33.347368% {
+  34.505585% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7688,18 +8026,19 @@
   }
 }
 
-.ThumbnailGridTransparent-Group-2147222320 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailGridTransparent-Group-2147222320-transform 2375ms linear infinite both;
+.StickySectionPresetsGridRows-group-mtr8obho-3 {
+  transform-origin: 55.071684px 42.848101px;
+  animation:
+    StickySectionPresetsGridRows-group-mtr8obho-3-transform 2417ms linear infinite both,
+    StickySectionPresetsGridRows-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailGridTransparent-Group-2147222320-transform {
+@keyframes StickySectionPresetsGridRows-group-mtr8obho-3-transform {
   0% {
-    transform: translate(0px, 57.591696px);
+    transform: translate(0px, 58.340508px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  40.336842% {
+  41.373604% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7709,31 +8048,34 @@
 }
     
 
-/* ThumbnailSideBySide */
+/* StickySectionPresetsSideBySide */
 
-.ThumbnailSideBySide-root {
+.StickySectionPresetsSideBySide-root {
   max-width: 100%;
   height: auto;
 }
 
-.ThumbnailSideBySide-root {
-  --color-1: #7896FF;
+.StickySectionPresetsSideBySide-root *, .StickySectionPresetsSideBySide-root *::before, .StickySectionPresetsSideBySide-root *::after { animation-delay: -1700ms !important; }
+
+.StickySectionPresetsSideBySide-root {
+  --color-1: #F8F6F6;
   --color-2: #002294;
-  --color-3: #F8F6F6;
+  --color-3: #7896FF;
 }
 
-.ThumbnailSideBySide-group-mtr8nkm4-1 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSideBySide-group-mtr8nkm4-1-transform 2375ms linear infinite both;
+.StickySectionPresetsSideBySide-Group-2147222318 {
+  transform-origin: 19.6262px 29.50695px;
+  animation:
+    StickySectionPresetsSideBySide-Group-2147222318-transform 2417ms linear infinite both,
+    StickySectionPresetsSideBySide-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailSideBySide-group-mtr8nkm4-1-transform {
+@keyframes StickySectionPresetsSideBySide-Group-2147222318-transform {
   0% {
-    transform: translate(0px, 30px);
+    transform: translate(0px, 39.094881px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  26.315789% {
+  27.596194% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7742,72 +8084,34 @@
   }
 }
 
-.ThumbnailSideBySide-group-mtr8o0p7-2 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSideBySide-group-mtr8o0p7-2-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailSideBySide-group-mtr8o0p7-2-transform {
+@keyframes StickySectionPresetsSideBySide-shared-opacity-1 {
   0% {
-    transform: translate(0px, 51.778772px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  33.347368% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  100% {
-    transform: translate(0px, 0px);
+    opacity: 0;
   }
-}
-
-.ThumbnailSideBySide-group-mtr8obho-3 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSideBySide-group-mtr8obho-3-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailSideBySide-group-mtr8obho-3-transform {
-  0% {
-    transform: translate(0px, 57.591696px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.736691% {
+    opacity: 0;
   }
-  40.336842% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.737691% {
+    opacity: 1;
   }
   100% {
-    transform: translate(0px, 0px);
+    opacity: 1;
   }
 }
-    
-
-/* ThumbnailSideBySideTransparent */
-
-.ThumbnailSideBySideTransparent-root {
-  max-width: 100%;
-  height: auto;
-}
-
-.ThumbnailSideBySideTransparent-root {
-  --color-1: #7896FF;
-  --color-2: #002294;
-  --color-3: #F8F6F6;
-}
 
-.ThumbnailSideBySideTransparent-group-mtr8nkm4-1 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSideBySideTransparent-group-mtr8nkm4-1-transform 2375ms linear infinite both;
+.StickySectionPresetsSideBySide-Group-2147222319 {
+  transform-origin: 34.001201px 33.991349px;
+  animation:
+    StickySectionPresetsSideBySide-Group-2147222319-transform 2417ms linear infinite both,
+    StickySectionPresetsSideBySide-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailSideBySideTransparent-group-mtr8nkm4-1-transform {
+@keyframes StickySectionPresetsSideBySide-Group-2147222319-transform {
   0% {
-    transform: translate(0px, 30px);
+    transform: translate(0px, 53.865117px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  26.315789% {
+  34.505585% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7816,18 +8120,19 @@
   }
 }
 
-.ThumbnailSideBySideTransparent-group-mtr8o0p7-2 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSideBySideTransparent-group-mtr8o0p7-2-transform 2375ms linear infinite both;
+.StickySectionPresetsSideBySide-Group-2147222320 {
+  transform-origin: 53.81885px 26.68909px;
+  animation:
+    StickySectionPresetsSideBySide-Group-2147222320-transform 2417ms linear infinite both,
+    StickySectionPresetsSideBySide-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailSideBySideTransparent-group-mtr8o0p7-2-transform {
+@keyframes StickySectionPresetsSideBySide-Group-2147222320-transform {
   0% {
-    transform: translate(0px, 51.778772px);
+    transform: translate(0px, 58.340508px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  33.347368% {
+  41.373604% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7836,52 +8141,55 @@
   }
 }
 
-.ThumbnailSideBySideTransparent-group-mtr8obho-3 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSideBySideTransparent-group-mtr8obho-3-transform 2375ms linear infinite both;
+.StickySectionPresetsSideBySide-import-mtr80uod-2-2 {
+  animation: StickySectionPresetsSideBySide-import-mtr80uod-2-2-opacity 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailSideBySideTransparent-group-mtr8obho-3-transform {
+@keyframes StickySectionPresetsSideBySide-import-mtr80uod-2-2-opacity {
   0% {
-    transform: translate(0px, 57.591696px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+    opacity: 1;
   }
-  40.336842% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.737691% {
+    opacity: 1;
+  }
+  1.738691% {
+    opacity: 0;
   }
   100% {
-    transform: translate(0px, 0px);
+    opacity: 0;
   }
 }
     
 
-/* ThumbnailSplit */
+/* StickySectionPresetsSplit */
 
-.ThumbnailSplit-root {
+.StickySectionPresetsSplit-root {
   max-width: 100%;
   height: auto;
 }
 
-.ThumbnailSplit-root {
+.StickySectionPresetsSplit-root *, .StickySectionPresetsSplit-root *::before, .StickySectionPresetsSplit-root *::after { animation-delay: -1700ms !important; }
+
+.StickySectionPresetsSplit-root {
   --color-1: #F8F6F6;
   --color-2: #002294;
   --color-3: #7896FF;
+  --illustration-color-opacity-25: rgba(248, 246, 246, 0);
 }
 
-.ThumbnailSplit-Frame-1707483277 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSplit-Frame-1707483277-transform 2375ms linear infinite both;
+.StickySectionPresetsSplit-Frame-1707483277 {
+  transform-origin: 65.235903px 42.92625px;
+  animation:
+    StickySectionPresetsSplit-Frame-1707483277-transform 2417ms linear infinite both,
+    StickySectionPresetsSplit-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailSplit-Frame-1707483277-transform {
+@keyframes StickySectionPresetsSplit-Frame-1707483277-transform {
   0% {
-    transform: translate(0px, 57.377876px);
+    transform: translate(0px, 58.20055px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  38.568421% {
+  39.635912% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7890,38 +8198,34 @@
   }
 }
 
-.ThumbnailSplit-Frame-1707483278 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSplit-Frame-1707483278-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailSplit-Frame-1707483278-transform {
+@keyframes StickySectionPresetsSplit-shared-opacity-1 {
   0% {
-    transform: translate(0px, 50.823251px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+    opacity: 0;
   }
-  31.578947% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.736691% {
+    opacity: 0;
+  }
+  1.737691% {
+    opacity: 1;
   }
   100% {
-    transform: translate(0px, 0px);
+    opacity: 1;
   }
 }
 
-.ThumbnailSplit-Frame-1707483281 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSplit-Frame-1707483281-transform 2375ms linear infinite both;
+.StickySectionPresetsSplit-Frame-1707483278 {
+  transform-origin: 44.5px 34px;
+  animation:
+    StickySectionPresetsSplit-Frame-1707483278-transform 2417ms linear infinite both,
+    StickySectionPresetsSplit-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailSplit-Frame-1707483281-transform {
+@keyframes StickySectionPresetsSplit-Frame-1707483278-transform {
   0% {
-    transform: translate(0px, 24.979506px);
+    transform: translate(0px, 53.207292px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  24.561403% {
+  32.767894% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7929,33 +8233,20 @@
     transform: translate(0px, 0px);
   }
 }
-    
-
-/* ThumbnailSplitTransparent */
-
-.ThumbnailSplitTransparent-root {
-  max-width: 100%;
-  height: auto;
-}
-
-.ThumbnailSplitTransparent-root {
-  --color-1: #F8F6F6;
-  --color-2: #002294;
-  --color-3: #7896FF;
-}
 
-.ThumbnailSplitTransparent-Frame-1707483277 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSplitTransparent-Frame-1707483277-transform 2375ms linear infinite both;
+.StickySectionPresetsSplit-Frame-1707483281 {
+  transform-origin: 44.5px 24px;
+  animation:
+    StickySectionPresetsSplit-Frame-1707483281-transform 2417ms linear infinite both,
+    StickySectionPresetsSplit-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailSplitTransparent-Frame-1707483277-transform {
+@keyframes StickySectionPresetsSplit-Frame-1707483281-transform {
   0% {
-    transform: translate(0px, 57.377876px);
+    transform: translate(0px, 35.105832px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  38.568421% {
+  25.872293% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -7964,73 +8255,59 @@
   }
 }
 
-.ThumbnailSplitTransparent-Frame-1707483278 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSplitTransparent-Frame-1707483278-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailSplitTransparent-Frame-1707483278-transform {
-  0% {
-    transform: translate(0px, 50.823251px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  31.578947% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  100% {
-    transform: translate(0px, 0px);
-  }
+.StickySectionPresetsSplit-split07 {
+  animation: StickySectionPresetsSplit-shared-opacity-1 2417ms linear infinite both;
 }
 
-.ThumbnailSplitTransparent-Frame-1707483281 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailSplitTransparent-Frame-1707483281-transform 2375ms linear infinite both;
+.StickySectionPresetsSplit-split07-2 {
+  animation: StickySectionPresetsSplit-split07-2-opacity 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailSplitTransparent-Frame-1707483281-transform {
+@keyframes StickySectionPresetsSplit-split07-2-opacity {
   0% {
-    transform: translate(0px, 24.979506px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+    opacity: 1;
   }
-  24.561403% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.737691% {
+    opacity: 1;
+  }
+  1.738691% {
+    opacity: 0;
   }
   100% {
-    transform: translate(0px, 0px);
+    opacity: 0;
   }
 }
     
 
-/* ThumbnailZigzag */
+/* StickySectionPresetsZigzag */
 
-.ThumbnailZigzag-root {
+.StickySectionPresetsZigzag-root {
   max-width: 100%;
   height: auto;
 }
 
-.ThumbnailZigzag-root {
+.StickySectionPresetsZigzag-root *, .StickySectionPresetsZigzag-root *::before, .StickySectionPresetsZigzag-root *::after { animation-delay: -1700ms !important; }
+
+.StickySectionPresetsZigzag-root {
   --color-1: #F8F6F6;
   --color-2: #002294;
   --color-3: #D5DFFF;
   --color-4: #7896FF;
 }
 
-.ThumbnailZigzag-Frame-1707483282 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailZigzag-Frame-1707483282-transform 2375ms linear infinite both;
+.StickySectionPresetsZigzag-Frame-1707483282 {
+  transform-origin: 73.415951px 31.243528px;
+  animation:
+    StickySectionPresetsZigzag-Frame-1707483282-transform 2417ms linear infinite both,
+    StickySectionPresetsZigzag-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailZigzag-Frame-1707483282-transform {
+@keyframes StickySectionPresetsZigzag-Frame-1707483282-transform {
   0% {
-    transform: translate(0px, 59.807137px);
+    transform: translate(0px, 59.917678px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  64.884211% {
+  65.494415% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -8039,58 +8316,34 @@
   }
 }
 
-.ThumbnailZigzag-Frame-1707483283 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailZigzag-Frame-1707483283-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailZigzag-Frame-1707483283-transform {
+@keyframes StickySectionPresetsZigzag-shared-opacity-1 {
   0% {
-    transform: translate(0px, 51.14881px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  43.859649% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  100% {
-    transform: translate(0px, 0px);
+    opacity: 0;
   }
-}
-
-.ThumbnailZigzag-Frame-1707483284 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailZigzag-Frame-1707483284-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailZigzag-Frame-1707483284-transform {
-  0% {
-    transform: translate(0px, 58.777289px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.736691% {
+    opacity: 0;
   }
-  57.852632% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.737691% {
+    opacity: 1;
   }
   100% {
-    transform: translate(0px, 0px);
+    opacity: 1;
   }
 }
 
-.ThumbnailZigzag-Frame-1707483285 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailZigzag-Frame-1707483285-transform 2375ms linear infinite both;
+.StickySectionPresetsZigzag-Frame-1707483283 {
+  transform-origin: 23.6111px 25.032149px;
+  animation:
+    StickySectionPresetsZigzag-Frame-1707483283-transform 2417ms linear infinite both,
+    StickySectionPresetsZigzag-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailZigzag-Frame-1707483285-transform {
+@keyframes StickySectionPresetsZigzag-Frame-1707483283-transform {
   0% {
-    transform: translate(0px, 56.367048px);
+    transform: translate(0px, 52.885347px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  50.863158% {
+  44.835195% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -8098,34 +8351,20 @@
     transform: translate(0px, 0px);
   }
 }
-    
-
-/* ThumbnailZigzagTransparent */
-
-.ThumbnailZigzagTransparent-root {
-  max-width: 100%;
-  height: auto;
-}
 
-.ThumbnailZigzagTransparent-root {
-  --color-1: #F8F6F6;
-  --color-2: #002294;
-  --color-3: #D5DFFF;
-  --color-4: #7896FF;
-}
-
-.ThumbnailZigzagTransparent-Frame-1707483282 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailZigzagTransparent-Frame-1707483282-transform 2375ms linear infinite both;
+.StickySectionPresetsZigzag-Frame-1707483284 {
+  transform-origin: 23.6111px 38.250849px;
+  animation:
+    StickySectionPresetsZigzag-Frame-1707483284-transform 2417ms linear infinite both,
+    StickySectionPresetsZigzag-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailZigzagTransparent-Frame-1707483282-transform {
+@keyframes StickySectionPresetsZigzag-Frame-1707483284-transform {
   0% {
-    transform: translate(0px, 59.807137px);
+    transform: translate(0px, 59.139912px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  64.884211% {
+  58.585023% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -8134,18 +8373,19 @@
   }
 }
 
-.ThumbnailZigzagTransparent-Frame-1707483283 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailZigzagTransparent-Frame-1707483283-transform 2375ms linear infinite both;
+.StickySectionPresetsZigzag-Frame-1707483285 {
+  transform-origin: 44.3923px 30.69615px;
+  animation:
+    StickySectionPresetsZigzag-Frame-1707483285-transform 2417ms linear infinite both,
+    StickySectionPresetsZigzag-shared-opacity-1 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailZigzagTransparent-Frame-1707483283-transform {
+@keyframes StickySectionPresetsZigzag-Frame-1707483285-transform {
   0% {
-    transform: translate(0px, 51.14881px);
+    transform: translate(0px, 57.155466px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
-  43.859649% {
+  51.717005% {
     transform: translate(0px, 0px);
     animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
   }
@@ -8154,43 +8394,22 @@
   }
 }
 
-.ThumbnailZigzagTransparent-Frame-1707483284 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailZigzagTransparent-Frame-1707483284-transform 2375ms linear infinite both;
+.StickySectionPresetsZigzag-Thumbnail-Container-2 {
+  animation: StickySectionPresetsZigzag-Thumbnail-Container-2-opacity 2417ms linear infinite both;
 }
 
-@keyframes ThumbnailZigzagTransparent-Frame-1707483284-transform {
+@keyframes StickySectionPresetsZigzag-Thumbnail-Container-2-opacity {
   0% {
-    transform: translate(0px, 58.777289px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  57.852632% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
-  }
-  100% {
-    transform: translate(0px, 0px);
+    opacity: 1;
   }
-}
-
-.ThumbnailZigzagTransparent-Frame-1707483285 {
-  transform-box: fill-box;
-  transform-origin: 50% 50%;
-  animation: ThumbnailZigzagTransparent-Frame-1707483285-transform 2375ms linear infinite both;
-}
-
-@keyframes ThumbnailZigzagTransparent-Frame-1707483285-transform {
-  0% {
-    transform: translate(0px, 56.367048px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.737691% {
+    opacity: 1;
   }
-  50.863158% {
-    transform: translate(0px, 0px);
-    animation-timing-function: cubic-bezier(0.801, 0, 0.199, 1);
+  1.738691% {
+    opacity: 0;
   }
   100% {
-    transform: translate(0px, 0px);
+    opacity: 0;
   }
 }