
/* Arrows */
.slick-prev,
.slick-next
{
    position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 48px;
	height: 48px;
	background: rgba(255, 255, 255, 0.6); /* прозорий фон */
	border: none;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 5;
	font-size:0;
	transition: background 0.3s, backdrop-filter 0.3s;
	backdrop-filter: blur(2px); /* розмиття фону позаду кнопки */
}

.slick-prev:hover,
.slick-next:hover
{
	background-color:rgba(158, 197, 249,.6);
    outline: none;
	-webkit-transition: all.4s ease;
	-moz-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-o-transition: all .4s ease;
	transition: all .4s ease;
}

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}


.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity:1;
}

.slick-prev:before,
.slick-next:before
{
    font-family: 'slick';
    font-size: 20px;
    line-height: 1;

    opacity: 1;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	-webkit-transition: all.4s ease;
	-moz-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-o-transition: all .4s ease;
	transition: all .4s ease;
}


.slick-next{right: 15px;}


.slick-prev{left: 15px;}

.slick-prev:before
{
    content: '';

	display:block;
	background-image:url(../images/arrow-slide.png)!important;
	display:block;
	z-index:10;
	background-size:100%;
	background-position:center center;
	background-repeat:no-repeat;
	width:60px;
	height:60px;
	
	-moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg); 
    -webkit-transform: rotate(-180deg); 
    -o-transform: rotate(-180deg); 
    transform: rotate(-180deg);
	

}

.slick-next:before
{
    content: '';
	width:60px;
	height:60px;
	background-image:url(../images/arrow-slide.png)!important;
	display:block;
	z-index:10;
	background-size:100%;
	background-position:center center;
	background-repeat:no-repeat;
	

}

/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
    position: absolute;
    bottom: -25px;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}


.mobile-top-products .promo .slick-dots{
    position: absolute;
    bottom: -23px;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;

    text-align: center;
}

.mobile-top-products .promo .slick-dots li
{
    position: relative;

    display: inline-block;

    width: 15px;
    height: 5px;
    margin: 0 0px;
    padding: 0;
    cursor: pointer;
}
.mobile-top-products .promo .slick-dots li button
{
    font-size: 0;
    line-height: 0;
    display: block;

    width: 10px;
    height: 10px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 12px;
    line-height: 20px;

    position: absolute;
    top: 35%;
    left: 35%;
    width: 6px;
    height: 6px;
	background:rgba(0,0,0,.13);
	border-radius:50%;
    content: '';
    text-align: center;

    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	-webkit-transition: all .24s ease;
	-moz-transition: all .24 ease;
	-ms-transition: all .24s ease;
	-o-transition: all .24s ease;
	transition: all .24s ease;
}

.slick-dots li.slick-active button:before
{
    background:rgba(0, 0, 0,.69);
	-webkit-transition: all .24s ease;
	-moz-transition: all .24 ease;
	-ms-transition: all .24s ease;
	-o-transition: all .24s ease;
	transition: all .24s ease;
}
