.carousel {
    .carousel-control {
        cursor: pointer;
        display:  none;
    }

    &:hover .carousel-control {
        display:  inline-block;
    }

    .carousel-control.left {
        background-image: linear-gradient(to left, rgba(39, 44, 56, 0.0), $home-container-background);
        bottom: 0;
        cursor: pointer;
        left: 0;
        position: absolute;
        text-align: center;
        top: 0;
        width: 62px;
        z-index: 2;

        span {
            display: none;
        }

        &:after {
            background-image: url('/img/icons_v1/icon-carousel_left.svg');
            background-repeat: no-repeat;
            background-size: contain;
            content: "";
            display: block;
            height: 24px;
            left: 35px;
            position: absolute;
            top: calc(50% - 12px);
            width: 12px;
        }
    }

    .carousel-control.right {
        background-image: linear-gradient(to right, rgba(39, 44, 56, 0.0), $home-container-background);
        bottom: 0;
        cursor: pointer;
        position: absolute;
        right: 0;
        text-align: center;
        top: 0;
        width: 62px;

        span {
            display: none;
        }

        &:after {
            background-image: url('/img/icons_v1/icon-carousel_right.svg');
            background-repeat: no-repeat;
            background-size: contain;
            content: "";
            display: block;
            height: 24px;
            position: absolute;
            right: 35px;
            top: calc(50% - 12px);
            width: 12px;
            z-index: 3;
        }
    }

    .carousel-indicators li {
        margin-right: 20px;
    }

    .carousel-indicators li:last-child {
        margin-right: 0;
    }

    .carousel-indicators{
        bottom:5px;
    }

}
