html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

html {
    position: relative;
    min-height: 500px;
}

body {
    font-family: Vazirmatn, bootstrap-icons;
    margin-bottom: 60px;
    height: 100% !important;
}

bgColor_BlueViolet {
    background-color: #9933CC;
}

Color_BlueViolet {
    color: #9933CC;
}

@media (max-width: 767px) {
    .carousel-inner .carousel-item > div {
        display: none;
    }

        .carousel-inner .carousel-item > div:first-child {
            display: block;
        }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}

/* medium and up screens */
@media (min-width: 768px) {

    .carousel-inner .carousel-item-end.active,
    .carousel-inner .carousel-item-next {
        transform: translateX(25%);
    }

    .carousel-inner .carousel-item-start.active,
    .carousel-inner .carousel-item-prev {
        transform: translateX(-25%);
    }
}

.carousel-inner .carousel-item-end,
.carousel-inner .carousel-item-start {
    transform: translateX(0);
}

#btn-back-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
}

.img {
    position: relative;
}

    .img i {
        top: 90%;
        left: 10%;
        position: absolute;
        transform: translate(-50%, -50%);
    }