
/* display none until init */
.product-carousel{
	display: none;
	opacity:1!important;
	position: relative;
	width: 100%;
	-ms-touch-action: pan-y;
}
#column-left .product-carousel, #column-right .product-carousel { display:block;}
#column-left .customNavigation, #column-right .customNavigation { display:none;}

#column-left .banners-slider-carousel .customNavigation,
#column-right .banners-slider-carousel .customNavigation{ display:block;}

.product-carousel .slider-wrapper{
	display: none;
	position: relative;
	-webkit-transform: translate3d(0px, 0px, 0px);
}
.product-carousel .slider-wrapper-outer{
	overflow: hidden;
	position: relative;
	width: 100%;
}
.product-carousel .slider-wrapper-outer.autoHeight{
	-webkit-transition: height 500ms ease-in-out;
	-moz-transition: height 500ms ease-in-out;
	-ms-transition: height 500ms ease-in-out;
	-o-transition: height 500ms ease-in-out;
	transition: height 500ms ease-in-out;
}
	
.product-carousel .slider-item{
	float: left;
}
.slider-controls .slider-page,
.slider-controls .slider-buttons div{
	cursor: pointer;
}
.slider-controls {
	-webkit-tap-highlight-color: transparent;
}

/* mouse grab icon */
 



/* fix */
.product-carousel .slider-wrapper,
.product-carousel .slider-item
{
	-webkit-backface-visibility : hidden;
	-moz-backface-visibility    : hidden;
	-ms-backface-visibility     : hidden;
}

.customNavigation
{
	position  : absolute;
	z-index   : 9;
	width     : 85px;
	top       : -25px;
	direction : ltr !important;
}

.customNavigation a
{
	font-size           : 0px;
	border              : 0;
	position            : absolute;
	font-weight         : 300;
	height              : 32px;
	width               : 42px;
	line-height         : 26px;
	padding             : 0px;
	color               : #000;
	/* background: transparent url(../../image/codezeel/arrow.png) no-repeat scroll 0 0; */
	background-color    : transparent;
	background-size : 52%;
	background-position : 42% 35% !important;
	background-repeat   : no-repeat;
	cursor              : pointer;
	overflow            : hidden;
	filter: drop-shadow(1px 2px 4px rgb(0 0 0 / 20%));
	transition          : all 0.5s ease 0s;
}
.customNavigation a:before
{
	content : "";
	width: calc(100% - 2px);
	height : 25px;
	position : absolute;
	top : 0;
	left : 0;
	transform : translateY(0%);
	opacity : 0;
	transition : 25ms;
	background-color : rgb(255 255 255 / 10%);
}


.customNavigation a:hover:before
{
	opacity : 1;
}
.customNavigation a.prev
{
	background-image : url('../../image/codezeel/arrow_prev.svg');
}
.customNavigation a.next
{
	background-image : url('../../image/codezeel/arrow_next.svg');
}
.customNavigation a.prev:hover{
	background-image : url('../../image/codezeel/arrow_prev_hover.svg') !important;
}
.customNavigation a.next:hover{
	background-image : url('../../image/codezeel/arrow_next_hover.svg') !important;
}
.customNavigation a:hover
{
	border-color : #000;
}

.customNavigation a:hover:before
{
	color : #000;
}

.customNavigation a.prev
{
	left                : 0;
	background-position : -17px -18px;
}

.customNavigation a.prev:hover
{
	background-position : -17px -54px;
}

.customNavigation a.next
{
	right               : 0;
	background-position : -102px -17px;
}

.customNavigation a.next:hover
{
	background-position : -102px -54px;
}

.customNavigation a.prev:after
{
	position     : absolute;
	content      : "";
	font-size    : 16px;
	border-right : 1px solid #dbdbdb;
	height       : 15px;
	left         : 0;
	right        : -40px;
	margin       : 0 auto;
	width        : 1px;
	top          : 5px;
}

@media (max-width : 1460px)
{
	.customNavigation a.prev
	{
		left : 0px;
	}
	
	.customNavigation a.next
	{
		right : 0px;
	}
}

@media (max-width : 767px)
{
	
}
