.cg-main-swiper .swiper-slide, .cg-thumb-swiper .swiper-slide { text-align: center; font-size: 18px; background: #fff; display: flex; justify-content: center; align-items: center; height: auto; flex-flow: wrap; } .swiper-slide-imglink { height: auto; width: 100%; } .cg-thumb-swiper { height: 20%; box-sizing: border-box; padding-top: 10px; } .cg-thumb-swiper .swiper-slide { height: 100%; opacity: 0.4; } .cg-thumb-swiper .swiper-slide:focus-visible { outline: 0.25rem solid #2491ff; outline-offset: 0; } .cg-main-swiper .swiper-button-next, .cg-main-swiper .swiper-button-prev, .cg-thumb-swiper .swiper-button-next, .cg-thumb-swiper .swiper-button-prev { background-image: none; } .cg-swiper-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; transform-origin: 50%; animation: swiper-preloader-spin 1s infinite linear; box-sizing: border-box; border: 4px solid var(--swiper-preloader-color,var(--swiper-theme-color)); border-radius: 50%; border-top-color: transparent; } .cg-main-swiper .swiper-button-next.swiper-button-disabled, .cg-main-swiper .swiper-button-prev.swiper-button-disabled, .cg-thumb-swiper .swiper-button-next.swiper-button-disabled, .cg-thumb-swiper .swiper-button-prev.swiper-button-disabled { visibility: hidden; } .cg-thumbs-3.cg-thumb-swiper .swiper-slide { width: 33.3333%; } .cg-thumbs-4.cg-thumb-swiper .swiper-slide { width: 25%; } .cg-thumbs-5.cg-thumb-swiper .swiper-slide { width: 20%; } .cg-thumbs-6.cg-thumb-swiper .swiper-slide { width: 16.6666%; } .cg-thumbs-7.cg-thumb-swiper .swiper-slide { width: 14.2857%; } .cg-thumbs-8.cg-thumb-swiper .swiper-slide { width: 12.5%; } #commercegurus-pdp-gallery .swiper-container:not(.swiper-container-initialized) .swiper-button-prev { visibility: hidden; } .cg-thumbs-count-2:not(.swiper-container-initialized) .swiper-wrapper, .cg-thumbs-count-3:not(.swiper-container-initialized) .swiper-wrapper { justify-content: center; } .cg-thumb-swiper.swiper-container { margin-left: -5px; width: calc(100% + 10px); } .rtl .cg-thumb-swiper.swiper-container { margin-left: 0; margin-right: -5px; } .cg-thumb-swiper .swiper-slide { padding-left: 5px; padding-right: 5px; background-color: transparent; } .product ul li.swiper-slide { margin: 0; } div.cg-main-swiper div.cgkit-play, div.cg-main-swiper div.cgkit-play svg, div.pswp__scroll-wrap div.cgkit-play, div.pswp__scroll-wrap div.cgkit-play svg { width: 80px; height: 80px; } div.cg-main-swiper div.cgkit-play svg, div.pswp__scroll-wrap div.cgkit-play svg { width: 100px; height: 100px; } div#elementor-lightbox-slideshow-single-img { display: none !important; } @media (max-width: 770px) { .cg-m-thumbs-3.cg-thumb-swiper .swiper-slide { width: 33.3333%; } .cg-m-thumbs-4.cg-thumb-swiper .swiper-slide { width: 25%; } .cg-m-thumbs-5.cg-thumb-swiper .swiper-slide { width: 20%; } .cg-m-thumbs-6.cg-thumb-swiper .swiper-slide { width: 16.6666%; } .cg-m-thumbs-7.cg-thumb-swiper .swiper-slide { width: 14.2857%; } .cg-m-thumbs-8.cg-thumb-swiper .swiper-slide { width: 12.5%; } } @media (min-width: 771px) { .cg-layout-vertical-right { display: flex; } .cg-layout-vertical-right .cg-main-swiper { flex: calc(100% - 100px); margin-left: 0px; margin-right: 5px; transition: all 0.1s ease-in; } .rtl .cg-layout-vertical-right .cg-main-swiper { margin-left: 5px; margin-right: 0; } .cg-layout-vertical-right .cg-thumb-swiper { flex: 100px; padding: 0px; } .cg-layout-vertical-right .cg-thumb-swiper .swiper-wrapper { display: block; } .cg-layout-vertical-right .cg-thumb-swiper .swiper-slide { width: 100px; height: 105px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; cursor: pointer; overflow: hidden; position: relative; padding: 2.5px 0 2.5px 5px; } .rtl .cg-layout-vertical-right .cg-thumb-swiper .swiper-slide { padding: 2.5px 5px 2.5px 0px; } .cg-layout-vertical-right .cg-thumb-swiper .swiper-slide:first-child { padding-top: 0px; } .cg-layout-vertical-right .cg-thumb-swiper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; } .cg-layout-vertical-left { display: flex; } .cg-layout-vertical-left .cg-main-swiper { flex: calc(100% - 100px); margin-left: 5px; margin-right: 0px; transition: all 0.1s ease-in; order: 2; } .rtl .cg-layout-vertical-left .cg-main-swiper { margin-right: 5px; margin-left: 0; } .cg-layout-vertical-left .cg-thumb-swiper { flex: 100px; padding: 0px; order: 1; } .cg-layout-vertical-left .cg-thumb-swiper .swiper-wrapper { display: block; } .cg-layout-vertical-left .cg-thumb-swiper .swiper-slide { width: 100px; height: 105px; display: flex; align-items: center; justify-content: center; box-sizing: border-box; cursor: pointer; overflow: hidden; position: relative; padding: 2.5px 0 2.5px 5px; } .rtl .cg-layout-vertical-left .cg-thumb-swiper .swiper-slide { padding: 2.5px 5px 2.5px 0px; } .cg-layout-vertical-left .cg-thumb-swiper .swiper-slide:first-child { padding-top: 0px; } .cg-layout-vertical-left .cg-thumb-swiper .swiper-slide img { width: 100%; height: 100%; object-fit: cover; } .cg-layout-vertical-left.cgkit-one-slider .cg-main-swiper, .cg-layout-vertical-right.cgkit-one-slider .cg-main-swiper { flex: 100%; margin-left: 0px; margin-right: 0px; } .cg-layout-vertical-left.cgkit-one-slider .cg-thumb-swiper, .cg-layout-vertical-right.cgkit-one-slider .cg-thumb-swiper { flex: 0%; margin-left: 0px; margin-right: 0px; } .cg-layout-vertical-left.cgkit-one-slider .swiper-button-next, .cg-layout-vertical-right.cgkit-one-slider .swiper-button-prev { display: none; } .cg-layout-vertical-left.cgkit-mb10 .cg-main-swiper .swiper-slide, .cg-layout-vertical-right.cgkit-mb10 .cg-main-swiper .swiper-slide { align-items: flex-start; } } #commercegurus-pdp-gallery:not(.cg-lightbox-active) .swiper-slide-imglink { cursor: default; } .swiper-container.cg-main-swiper .swiper-wrapper .swiper-slide { display: none; } .swiper-container.cg-main-swiper .swiper-wrapper .swiper-slide:first-child { display: flex; } .swiper-container.cg-main-swiper.swiper-container-initialized .swiper-wrapper .swiper-slide { display: flex; } #commercegurus-pdp-gallery.cg-layout-vertical-left .swiper-button-next, #commercegurus-pdp-gallery.cg-layout-vertical-left .swiper-button-prev, #commercegurus-pdp-gallery.cg-layout-vertical-right .swiper-button-next, #commercegurus-pdp-gallery.cg-layout-vertical-right .swiper-button-prev { width: 42px; height: 42px; margin-top: -21px; background: hsla(0, 0%, 100%, .75); transition: background .5s ease; border-radius: 0; cursor: pointer; } @media (min-width: 771px) { #commercegurus-pdp-gallery.cg-layout-vertical-left .cg-thumb-swiper .swiper-button-next, #commercegurus-pdp-gallery.cg-layout-vertical-left .cg-thumb-swiper .swiper-button-prev, #commercegurus-pdp-gallery.cg-layout-vertical-right .cg-thumb-swiper .swiper-button-next, #commercegurus-pdp-gallery.cg-layout-vertical-right .cg-thumb-swiper .swiper-button-prev { display: flex; top: 20px; left: 5px; width: calc(100% - 5px); height: 20px; } .rtl #commercegurus-pdp-gallery.cg-layout-vertical-left .cg-thumb-swiper .swiper-button-next, .rtl #commercegurus-pdp-gallery.cg-layout-vertical-left .cg-thumb-swiper .swiper-button-prev, .rtl #commercegurus-pdp-gallery.cg-layout-vertical-right .cg-thumb-swiper .swiper-button-next, .rtl #commercegurus-pdp-gallery.cg-layout-vertical-right .cg-thumb-swiper .swiper-button-prev { left: auto; right: 5px; } #commercegurus-pdp-gallery.cg-layout-vertical-left .cg-thumb-swiper .swiper-button-next, #commercegurus-pdp-gallery.cg-layout-vertical-right .cg-thumb-swiper .swiper-button-next { top: auto; bottom: 0; } #commercegurus-pdp-gallery.cg-layout-vertical-left .cg-thumb-swiper .swiper-button-next:after, #commercegurus-pdp-gallery.cg-layout-vertical-right .cg-thumb-swiper .swiper-button-next:after { transform: rotate(270deg); width: 18px; } #commercegurus-pdp-gallery.cg-layout-vertical-left .cg-thumb-swiper .swiper-button-prev:after, #commercegurus-pdp-gallery.cg-layout-vertical-right .cg-thumb-swiper .swiper-button-prev:after { transform: rotate(90deg); width: 18px; } }