طراحی اسکرول تانل با المنتور در وردپرس

				
					<style>
body{
    --smooth-scroll: true;
}
[class^='mdw-image-gallery-3d'],
[class*='mdw-image-gallery-3d']{
    --disabled-section-padding-top: 70px;
    --disabled-section-padding-bottom: 50px;
}
[class^='mdw-image-gallery-3d'].disabled,
[class*='mdw-image-gallery-3d'].disabled{
    height: auto !important;
    padding-top: var(--disabled-section-padding-top, 70px);
    padding-bottom: var(--disabled-section-padding-bottom, 50px);
    overflow: hidden;
    position: relative;
}
html:not(.elementor-html) [class^='mdw-image-gallery-3d'] .elementor-widget-html,
html:not(.elementor-html) [class*='mdw-image-gallery-3d'] .elementor-widget-html{
    display: none;
}
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner,
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner{
    transform-style: preserve-3d;
    perspective: 750px;
    backface-visibility: hidden;
}
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-bg, 
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-bg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    opacity: 0.6;
}
[class^='mdw-image-gallery-3d'].disabled .mdw-image-gallery-bg,
[class*='mdw-image-gallery-3d'].disabled .mdw-image-gallery-bg{
    position: absolute !important;
    background-size: cover;
    background-position: center;
    filter: blur(50px);
    transform: scale(1.15);
    height: 100%;
}
[class^='mdw-image-gallery-3d'] .sticky,
[class*='mdw-image-gallery-3d'] .sticky {
    position: fixed;
    top: 0;
}
[class^='mdw-image-gallery-3d'] .sticky-end,
[class*='mdw-image-gallery-3d'] .sticky-end{
    position: absolute;
    bottom: 0;
    top: auto !important;
}
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-bg img,
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-bg img{
    position: absolute;
    left: 0;
    top: 0;
    filter: blur(50px);
    transform: scale(1.125); 
    max-width: unset;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
[class^='mdw-image-gallery-3d'].disabled .mdw-image-gallery-inner,
[class*='mdw-image-gallery-3d'].disabled .mdw-image-gallery-inner{
    flex-direction: row;
    flex-wrap: wrap;
    position: static !important;
    justify-content: center;
    gap: 12px;
}
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-con,
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-con,
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-container,
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-container{
    opacity: 0;
    transition: 0s;
    left: 70% !important;
}
[class^='mdw-image-gallery-3d'].disabled .mdw-image-gallery-inner > .e-con,
[class*='mdw-image-gallery-3d'].disabled .mdw-image-gallery-inner > .e-con,
[class^='mdw-image-gallery-3d'].disabled .mdw-image-gallery-inner > .e-container,
[class*='mdw-image-gallery-3d'].disabled .mdw-image-gallery-inner > .e-container{
    position: static;
    opacity: 1 !important;
    transform: none !important;
}
html.elementor-html [class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-con,
html.elementor-html [class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-con,
html.elementor-html [class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-container,
html.elementor-html [class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-container{
    opacity: 1;
}
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-con:nth-child(even),
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-con:nth-child(even),
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-container:nth-child(even),
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-container:nth-child(even){
    left: 30% !important;
}
[class^='mdw-image-gallery-3d'].disabled .mdw-image-gallery-inner .elementor-widget-image,
[class*='mdw-image-gallery-3d'].disabled .mdw-image-gallery-inner .elementor-widget-image{
    order: -1;
    margin-bottom: 15px;
}
@media (max-width: 1024px){
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-con,
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-con,
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-container,
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-container{
    left: 80% !important;
}
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-con:nth-child(even),
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-con:nth-child(even),
[class^='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-container:nth-child(even),
[class*='mdw-image-gallery-3d'] .mdw-image-gallery-inner > .e-container:nth-child(even){
    left: 20% !important;
}
}
</style>

<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>




<!-- Smooth Scroll -->
<style>
html.lenis, html.lenis body {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: hidden;
}
.lenis.lenis-smooth iframe {
  pointer-events: none;
}
</style>