/* APS Carousel CSS Styles */
:root {
	--csl-primary-color:#ddd;
	--csl-star-fill:#fdbb00;
}
.csl-carousel, .csl-carousel * {box-sizing:border-box; -webkit-box-sizing:border-box;}
.csl-carousel {float:left; width:100%; padding:0 1px 20px; margin:10px auto 20px; position:relative; z-index:1; display:block; overflow:hidden;}
.swiper-wrapper {width:100%; height:100%; position:relative; z-index:1; display:flex; transition-property:transform; transition-timing-function:var(--swiper-wrapper-transition-timing-function, initial); box-sizing:content-box;}
.swiper-android .swiper-slide, .swiper-ios .swiper-slide, .swiper-wrapper {transform:translate3d(0px, 0, 0);}
.swiper-vertical {touch-action:pan-x;}
.swiper-horizontal {touch-action:pan-y;}
.swiper-slide {width:100%; height:auto; position:relative; flex-shrink:0; display:block; transition-property:transform;}
.swiper-slide-invisible-blank {visibility:hidden;}
.swiper-autoheight, .swiper-autoheight .swiper-slide {height:auto;}
.swiper-autoheight .swiper-wrapper {align-items:flex-start; transition-property:transform, height;}
.swiper-backface-hidden .swiper-slide {transform:translateZ(0); -webkit-backface-visibility:hidden; backface-visibility:hidden;}
.swiper-pagination {position:absolute; text-align:center; transition:300ms opacity; transform:translate3d(0, 0, 0); z-index:10;}
.swiper-pagination.swiper-pagination-hidden {opacity:0;}
.swiper-pagination-disabled {display:none !important;}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {width:100%; left:0; bottom:0; top:auto;}
/* Bullets */
.swiper-pagination-bullet {width:8px; height:8px; display:inline-block; margin:0 3px; border-radius:50%; background:var(--csl-primary-color); transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}
.swiper-pagination-clickable .swiper-pagination-bullet {cursor:pointer;}
.swiper-pagination-bullet:only-child {display:none !important;}
.swiper-pagination-bullet.swiper-pagination-bullet-active {width:10px; height:10px; vertical-align:middle; background:var(--aps-skin-color-1);}
/* Fraction */
.swiper-pagination-fraction {color:var(--aps-text-color);}
/* Progress */
.swiper-pagination-progressbar {width:100%; height:3px; background:var(--csl-primary-color); position:absolute; left:0; bottom:10px;}
.swiper-pagination-progressbar-fill {width:100%; height:100%; background:var(--aps-skin-color-1); position:absolute; left:0; bottom:0; transform:scale(0); transform-origin:left bottom;}
.swiper-rtl .swiper-pagination-progressbar-fill {transform-origin:right bottom;}
.swiper-pagination-lock {display:none;}
.swiper-button-prev, .swiper-button-next {position:absolute; top:calc(50% - 20px); z-index:10; cursor:pointer; background:#000; opacity:.2; transition:all .3s ease; -webkit-transition:all .3s ease;}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {opacity:.1; cursor:auto; pointer-events:none;}
.swiper-button-prev.swiper-button-hidden,
.swiper-button-next.swiper-button-hidden {opacity:0; cursor:auto; pointer-events:none;}
.swiper-button-prev i, .swiper-button-next i {width:40px; height:40px; padding:5px; display:block; background-color:#fff;}
.swiper-button-prev {left:0;}
.swiper-button-next {right:0;}
.swiper-rtl .swiper-button-prev {left:auto; right:0;}
.swiper-rtl .swiper-button-next {right:auto; left:0;}
.csl-nav-circle {border-radius:50%; -webkit-border-radius:50%;}
.csl-nav-square {border-radius:3px; -webkit-border-radius:3px;}
.csl-icon-an {mask-image:url(img/icon-angle.svg); -webkit-mask-image:url(img/icon-angle.svg);}
.csl-icon-da {mask-image:url(img/icon-angles.svg); -webkit-mask-image:url(img/icon-angles.svg);}
.csl-icon-ar {mask-image:url(img/icon-arrow.svg); -webkit-mask-image:url(img/icon-arrow.svg);}
.csl-icon-ad {mask-image:url(img/icon-arrow-dots.svg); -webkit-mask-image:url(img/icon-arrow-dots.svg);}
.csl-icon-ap {mask-image:url(img/icon-arrow-point.svg); -webkit-mask-image:url(img/icon-arrow-point.svg);}
.csl-icon-at {mask-image:url(img/icon-arrow-triangle.svg); -webkit-mask-image:url(img/icon-arrow-triangle.svg);}
.swiper-button-next {transform:scaleX(-1);}
.swiper-rtl .swiper-button-prev {transform:scaleX(-1);}
.swiper-rtl .swiper-button-next {transform:scaleX(1);}
.swiper-button-prev:hover, .swiper-button-next:hover {background-color:var(--aps-skin-color-1); opacity:.7;}


.csl-aps-product {padding:5px; border:1px solid var(--csl-primary-color); border-right:none; background:#fff;}
.csl-aps-product:last-child {border-right:1px solid var(--csl-primary-color);}
.csl-item-thumb {width:100%; height:auto; overflow:hidden; position:relative; text-align:center;}
.csl-item-thumb a img {transition:all .3s ease; -webkit-transition:all .3s ease;}
.csl-img-zoom a img:hover {transform:scale(1.1); -webkit-transform:scale(1.1);}
.csl-img-flip a img:hover {animation:imageflip .8s linear .3s; -webkit-animation:imageflip .8s linear .3s;}
.csl-img-flash a img:hover {animation:imageflash .5s linear; -webkit-animation:imageflash .5s linear;}
.csl-img-shine:before {width:50%; height:100%; position:absolute; top:0; left:-75%; z-index:11; display:block; content:''; background:-webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.4) 100%); background:linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.4) 100%); transform:skewX(-25deg); -webkit-transform: skewX(-25deg);}
.csl-img-shine:hover::before {animation:imageshine .4s linear; -webkit-animation:imageshine .4s linear;}
.csl-img-pulse a img:hover {animation:imagepulse .7s linear; -webkit-animation:imagepulse .7s linear;}
.csl-img-shake a img:hover {animation:imageshake .4s linear; -webkit-animation:imageshake .4s linear;}
.csl-img-gray a img {filter:grayscale(0);}
.csl-img-gray a img:hover {filter:grayscale(100%);}
.csl-img-color a img {filter:grayscale(100%);}
.csl-img-color a img:hover {filter:grayscale(0);}
h3.csl-item-title, .csl-item-price {margin-bottom:5px; text-align:center; font-size:var(--aps-med-text);}
h3.csl-item-title {color:var(--aps-headings-color); white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}
.csl-item-price {display:block; color:var(--aps-skin-color-1); font-size:var(--aps-big-text);}
.csl-item-price del {color:#aaa; font-size:90%;}
.csl-aps-product .aps-on-sale {left:0;}
.swiper-rtl .csl-aps-product .aps-on-sale {right:0;}
.csl-item-rating {width:100%; margin-bottom:5px; display:flow; text-align:center;}
.csl-icon-star {margin:0 1px;}
.csl-icon-star:before {width:16px; height:16px; display:inline-block; content:""; vertical-align:text-top; mask-image:url(img/icon-star.svg); -webkit-mask-image:url(img/icon-star.svg);}
.csl-empty-star:before {background:var(--csl-primary-color);}
.csl-quarter-star:before {background:linear-gradient(to right, var(--csl-star-fill) 25%, var(--csl-primary-color) 25%);}
.csl-half-star:before {background:linear-gradient(to right, var(--csl-star-fill) 50%, var(--csl-primary-color) 50%);}
.csl-thrice-star:before {background:linear-gradient(to right, var(--csl-star-fill) 75%, var(--csl-primary-color) 75%);}
.csl-full-star:before {background:var(--csl-star-fill);}
.swiper-rtl .csl-quarter-star:before {background:linear-gradient(to left, var(--csl-star-fill) 25%, var(--csl-primary-color) 25%);}
.swiper-rtl .csl-half-star:before {background:linear-gradient(to left, var(--csl-star-fill) 50%, var(--csl-primary-color) 50%);}
.swiper-rtl .csl-thrice-star:before {background:linear-gradient(to left, var(--csl-star-fill) 75%, var(--csl-primary-color) 75%);}

@keyframes imageflip {
	0%, 100% {transform-style:preserve-3d; transform:rotateY(0); -webkit-transform:rotateY(0);}
	50% {transform-style:preserve-3d; transform:rotateY(180deg); -webkit-transform:rotateY(180deg);}
}
@keyframes imageflash {
	from {opacity:.3;}
	to {opacity:1;}
}
@keyframes imageshine {
	100% {left:125%;}
}
@keyframes imagepulse {
	0%, 50%, 100% {transform: scale(1); -webkit-transform: scale(1);}
	25%, 75% {transform: scale(1.1); -webkit-transform: scale(1.1);}
}
@keyframes imageshake {
	0%, 100% {transform: rotateZ(0); -webkit-transform: rotateZ(0);}
	20%, 60% {transform: rotateZ(10deg); -webkit-transform: rotateZ(10deg);}
	40%, 80% {transform: rotateZ(-10deg); -webkit-transform: rotateZ(-10deg);}
}