.hero-slides.swiper-container {

    .swiper-button-prev,
    .swiper-button-next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        font-size: 30px;
        color: $primary-colour;
        opacity: 0.8;
        z-index: 99999;
        display: block;
        box-sizing: border-box;
    }

    .swiper-button-prev {
        left: 15px;
    }

    .swiper-button-next {
        right: 15px;
    }

    .swiper-pagination {
        position: absolute;
        bottom: 5px;
        z-index: 9999;
        left: 35px;


        .swiper-pagination-bullet::before {
            font-family: "Font Awesome 5 Free";
            font-weight: 500;
            content: "\f111";
            font-size: 20px;
            color: $primary-colour;
            display: inline-block;
            font-style: normal;
            font-variant: normal;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
        }

        .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
            font-family: "Font Awesome 5 Free";
            font-weight: 900;
            content: "\f111";
            font-size: 20px;
            color: $primary-colour;
            display: inline-block;
            font-style: normal;
            font-variant: normal;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
        }
    }
}

.slider-brands.swiper-container {

    .swiper-pagination {
        position: absolute;
        bottom: 5px;
        z-index: 9999;
        left: 50%;
        transform: translateX(-50%);

        .swiper-pagination-bullet::before {
            font-family: "Font Awesome 5 Free";
            font-weight: 500;
            content: "\f111";
            font-size: 16px;
            color: $primary-colour;
            display: inline-block;
            font-style: normal;
            font-variant: normal;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
        }

        .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
            font-family: "Font Awesome 5 Free";
            font-weight: 900;
            content: "\f111";
            font-size: 16px;
            color: $primary-colour;
            display: inline-block;
            font-style: normal;
            font-variant: normal;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
        }
    }
}

#product-image #featuted-image .swiper-container {
    width: 100%;
    height: auto;

    .swiper-button-prev,
    .swiper-button-next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        font-size: 30px;
        color: $primary-colour;
        opacity: 0.8;
        z-index: 99999;
        display: block;
        box-sizing: border-box;
    }

    .swiper-button-prev {
        left: 15px;
    }

    .swiper-button-next {
        right: 15px;
    }
}


.products-slides.swiper-container {
    .swiper-button-prev,
    .swiper-button-next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        font-size: 30px;
        color: $primary-colour;
        opacity: 0.8;
        z-index: 99999;
        display: block;
        box-sizing: border-box;
    }

    .swiper-button-prev {
        left: -5px;
    }

    .swiper-button-next {
        right: -5px;
    }
}
