STEP product carousel

<link rel="stylesheet" type="text/css" href="/user/documents/upload/res/owl.carousel.min.css">
<link rel="stylesheet" type="text/css" href="/user/documents/upload/res/owl.theme.default.min.css">

<script>
$(".in-index .products.products-block").addClass("owl-carousel");
</script>
<script src='https://cdn.myshoptet.com/usr/code.kubanavratil.com/user/documents/upload/res/owl.carousel.min.js' type="text/javascript"></script>
<script>
$('.owl-carousel').owlCarousel({
loop:true,
margin:0,
nav:true,
responsiveClass:true,
responsive:{
0:{
items:1,
nav:true,
autoplay:true,
autoplayTimeout:4000,
autoplayHoverPause:true
},
768:{
items:2,
nav:true,
autoplay:true,
autoplayTimeout:5000,
autoplayHoverPause:true
},
900:{
items:3,
nav:true,
autoplay:true,
autoplayTimeout:5000,
autoplayHoverPause:true
},
1200:{
items:4,
nav:true,
loop:true,
autoplay:true,
autoplayTimeout:5000,
autoplayHoverPause:true
}
}
})
</script>

CSS

.in-index.columns-4 .wide .products-block>div {width: 100% !important;}
.in-index.columns-3 .products-block > div, .in-index.columns-4 .products-block>div {padding:0;}
.owl-stage-outer .product {padding:15px;}

.owl-prev {
width: 15px;
height: 100px;
position: absolute;
top: 40%;
margin-left: -20px;
display: block !important;
border:0px solid black;
}

.owl-next {
width: 15px;
height: 100px;
position: absolute;
top: 40%;
right: -25px;
display: block !important;
border:0px solid black;
}
.owl-prev i, .owl-next i {transform : scale(1,6); color: #ccc;}
@media (max-width:992px) {
.products-block.products>div {
padding: 0px;
}
.owl-next, .owl-prev {
background: #ffffffbf !important;
width: 30px;
height: 30px;
border-radius: 100%;
}
.owl-nav button span {
position: absolute;
left: 8px;
top: -15px;
display: block;
line-height: 1;
height: 30px;
}
.owl-nav .owl-prev span {left: 6px;}
.owl-next {right: 10px;}
.owl-prev {left: 10px;}
}
.tab-content>.tab-pane {
border-top: none;
}
.in-index.columns-4 .wide .products-block>.owl-nav {float:unset;}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {font-size: 55px !important;}
.owl-next, .owl-prev {top: 200px;}
.products-block > div .p .name {font-size:14px;}
.tab-pane .products-block {
margin: 0;
}