Не правильная анимация на Bootstrap 4 карусель

При пролистывании карусели происходит как будто бы раздвоение конента с ужасным эффектом.

Просмотреть можно на этом сайте http://job.web-agency.biz.ua в первом блоке сразу под маком.

Скрипт JS:

$('#recipeCarousel').carousel({
    interval: 3000
})
$('#recipeCarousel .carousel-item').each(function(){
    var next = $(this).next();
    if (!next.length) {
        next = $(this).siblings(':first');
    }
    next.children(':first-child').clone().appendTo($(this));
    if (next.next().length>0) {
        next.next().children(':first-child').clone().appendTo($(this));
    }
    else {
        $(this).siblings(':first').children(':first-child').clone().appendTo($(this));
    }
});

CSS:

#recipeCarousel .carousel-inner .carousel-item.active,
#recipeCarousel .carousel-inner .carousel-item-next,
#recipeCarousel .carousel-inner .carousel-item-prev {
    display: flex;
}
#recipeCarousel .carousel-inner .carousel-item-right.active,
#recipeCarousel .carousel-inner .carousel-item-next {
    transform: translateX(25%);
}
#recipeCarousel .carousel-inner .carousel-item-left.active,
#recipeCarousel .carousel-inner .carousel-item-prev {
    transform: translateX(-25%);
}
#recipeCarousel .carousel-inner .carousel-item-right,
#recipeCarousel .carousel-inner .carousel-item-left{
    transform: translateX(0);
}

#recipeCarousel .carousel-item .col-4{
    width:33.333%;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
    height: 100px;
    width: 100px;
    outline: black;
    background-size: 100%, 100%;
    border-radius: 50%;
    background-image: none;
    transform: scale(0.5, 1);
}
.carousel-control-next-icon:after
{
    content: '>';
    font-size: 55px;
    color: #272727;
}
.carousel-control-prev-icon:after {
    content: '<';
    font-size: 55px;
    color: #272727;
}

HTML:

<div class="container text-center my-3 mt-4 mb-4 pb-4">
            <div class="row mx-auto col-sm-12  col-md-6 my-auto">
                <div id="recipeCarousel" class="carousel slide" data-ride="carousel">
                    <div class="carousel-inner" role="listbox">
                        <div class="carousel-item active">
                            <img class="col-4 img-fluid" src="img/logo-patner/almerimar.jpg">
                        </div>
                        <div class="carousel-item">
                            <img class="col-4 img-fluid" src="img/logo-patner/cuencagolf.png">
                        </div>
                        <div class="carousel-item">
                            <img class="col-4 img-fluid" src="img/logo-patner/image.png">
                        </div>
                        <div class="carousel-item">
                            <img class="col-4 img-fluid" src="img/logo-patner/logo-balagares-color.png">
                        </div>
                        <div class="carousel-item">
                            <img class="col-4 img-fluid" src="img/logo-patner/logo-GolfClub-sin-fondo-1.png">
                        </div>
                        <div class="carousel-item">
                            <img class="col-4 img-fluid" src="img/logo-patner/logo-meaztegi-golf.png">
                        </div>
                        <div class="carousel-item">
                            <img class="col-4 img-fluid" src="img/logo-patner/logo_ASR_ok.png">
                        </div>
                        <div class="carousel-item">
                            <img class="col-4 img-fluid" src="img/logo-patner/lspa.png">
                        </div>
                        <div class="carousel-item">
                            <img class="col-4 img-fluid" src="img/logo-patner/png-374-1529398164.png">
                        </div>
                    </div>
                    <a class="carousel-control-prev" href="#recipeCarousel" role="button" data-slide="prev">
                        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                        <span class="sr-only">Previous</span>
                    </a>
                    <a class="carousel-control-next" href="#recipeCarousel" role="button" data-slide="next">
                        <span class="carousel-control-next-icon" aria-hidden="true"></span>
                        <span class="sr-only">Next</span>
                    </a>
                </div>
            </div>
        </div>