body {
    direction: rtl;
}
/* orginaly */
.max-with {
    max-width: 800px;
    margin: auto;
    position: relative;
}

.backBtn {
    font-size: 23px;
}

.underliner {
    text-decoration: underline !important;
}

.btn-color {
    background-color: rgb(27, 87, 123) !important;
    border-radius: 16px !important;
    color: #fff !important;
}

.btn-color2 {
    background-color: rgb(27, 87, 123) !important;
    color: #fff !important;
}

.btn-color7 {
    background-color: #f6c214 !important;
    border-radius: 16px !important;
    color: #fff !important;
}

.btn-FontSizeSet1 {
    font-size: 22px !important;
}

.btn-FontSizeSet2 {
    font-size: 18px !important;
}

.linkColor {
    color: #3591ab !important;
    font-weight: bold;
}
/* orginaly End */
.container {
    margin: 0 auto;
    padding: 1%;
}

*::placeholder {
    color: rgb(143, 143, 143) !important;
    font-weight: 100;
    font-size: 14px;
}

h1 {
    font-weight: 600;
}

.ff-reg {
}

.ff-reg-bold {
    font-weight: bold;
}

.font-sm {
    font-size: 12px !important;
}

.lbl-info {
    width: 100%;
    display: block;
    font-size: 14px;
    padding-right: 10px;
    min-height: 24px;
    color:firebrick;
}

.lbl-checkbox {
    font-size: 14px;
    font-weight: 500;
    margin-left: 6px;
}

.input-group > .form-control, .input-group > input {
    border-radius: .375rem 0 0 .375rem !important;
    letter-spacing: 4px;
}

.input-group > .input-group-text {
    border-radius: 0 .375rem .375rem 0 !important;
    font-weight: bold;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background-color: transparent;
    color: #1B577B;
    outline: 2px solid #1B577B;
    /* border-bottom: 2px solid #1B577B; */
}

.badge {
    z-index: 10;
}

.nav-link > .badge {
    left: 20px;
    color: #fff;
    max-width: 22px;
}

.nav-pills > li > a {
    background-color: #f1faff;
}

.modal-header .btn-close {
    margin-left: 0;
}

.modal * {
}

.modal-footer {
    justify-content: space-around;
}

.e-select {
    border-radius: 8px;
    background: #EDEEEF;
    border: none;
    outline: none;
    padding: 10px;
    font-size: 14px;
    max-height: 50px;
    min-height: 45px;
    transition: all ease .3s;
    outline: 1px solid transparent;
    /* font-size: 20px;  */
    color: rgb(143, 143, 143);
    /* color : #8f8f8f; */
}

.e-txt-link {
    color: #BC66FF;
}

.ShowCrop:not(.crop-active) {
    display: none;
}

.e-ImageBoxAll {
    border-radius: 20px;
    background: #EDEEEF;
    padding: 10px 0;
}

.cropper-container {
    width: 100% !important;
    overflow: hidden !important;
    max-height: 380px;
}

.ShowCrop {
    text-align: center;
    padding: 20px;
}

    .ShowCrop > img {
        max-width: 300px;
        border-radius: 10px;
    }

.e-select * {
    color: black !important;
}

.e-textarea {
    width: 100%;
    border-radius: 8px;
    background: #EDEEEF;
    border: none;
    outline: none;
    padding: 16px;
    font-size: 14px;
    color: rgba(0,0,0,.8) !important;
    transition: all ease .3s;
    outline: 1px solid transparent;
    font-weight: bold;
}

.e-input:focus {
    outline-color: #296192;
}

.form-check-input {
    border: var(--bs-border-width) solid rgba(121, 121, 121, 0.5);
}

.evrymodiriyat {
    padding-bottom: 6%;
    border-bottom: 2px solid #1B577B;
    /* border-radius: 10px; */
}

/* buttons */
.myBtn {
    background-color: #1B577B;
    color: #fff;
    border-color: #1B577B;
}

.Btn-cancel, .Btn-submit, .Btn-yellow, .Btn-submit-outline, .Btn-yellow-outline, .Btn-cancel2, .vaildprudact, .sucsessBtn1 {
    outline: none;
    border: none;
    transition: all ease .3s;
    padding: 8px 12px;
    border-radius: 0.375rem;
    font-size: 16px;
}

.sucsessBtn1 {
    background-color: #198754 !important;
    color: #fff !important;
}

.Btn-cancel {
    background-color: white;
    outline: 1px solid #87161a;
    color: #87161a;
    text-align: center;
    text-decoration: none;
}

.Btn-cancel2 {
    background-color: #87161a;
    color: white;
    text-align: center;
    text-decoration: none;
}

.Btn-cancel:hover {
    outline: 1px solid #87161a;
    background-color: #87161a;
    color: #fff;
}

.Btn-cancel:focus {
    outline: 1px solid #87161a !important;
    /* border: none !important; */
}

.Btn-submit {
    background-color: #1B577B;
    color: #fff;
    border-color: #1B577B;
}

.Btn-submit-outline {
    background-color: transparent;
    color: #1B577B;
    outline: 1px solid #1B577B;
    text-align: center;
    text-decoration: none;
}

    .Btn-submit-outline:hover {
        background-color: #1B577B;
        color: #fff;
        outline: 1px solid #1B577B;
    }

    .Btn-submit-outline:active {
        background-color: #124564 !important;
        color: #fff;
    }

.Btn-submit:active {
    background-color: #124564 !important;
    color: #fff;
}

.Btn-submitDisabled {
    background-color: #22668D;
    opacity: 50%;
}

    .Btn-submitDisabled:active {
        background-color: #22668D;
    }

.Btn-yellow {
    background: #f6c214;
    color: black;
}

.Btn-sucsess1 {
    background: #198754 !important;
    color: black !important;
}

.Btn-cancelyello {
    background-color: #f6c214;
}

.vaildprudact {
    background-color: #ccc;
    color: #212121;
}

.Btn-yellow:active {
    background: #f6c214;
    color: black;
}

.Btn-yellow-outline {
    background: white;
    outline: 1px solid #f6c214 !important;
    color: black;
}

    .Btn-yellow-outline:hover {
        background: #f6c214;
    }


.e-status {
    width: 100%;
    margin: 8px 0 !important;
}

    .e-status > ul {
        width: 100%;
        padding: 0;
        margin: 0;
        display: flex;
    }

        .e-status > ul > li {
            width: 23%;
            list-style-type: none;
            margin: 0 5px;
        }

            .e-status > ul > li > div {
                width: 100%;
                height: 12px;
                border-radius: 50px;
                background-color: rgb(165, 194, 255);
            }

            .e-status > ul > li > p {
                width: 100%;
                text-align: center;
                font-size: 12px;
                padding: 4px;
                margin: 0;
            }

.e-status-div {
    overflow: hidden;
}

    .e-status-div > div {
        background-color: #2A4BA0;
        height: 100%;
        width: 0;
    }


.e-status-active {
    border: 2px solid #2A4BA0;
}

.e-status-half {
    width: 50% !important;
    background-color: #2A4BA0;
}

.e-status-past {
    width: 100% !important;
    background-color: #2A4BA0 !important;
}

.e-status-cancel {
    width: 100% !important;
    background: #87161a !important;
    border-color: #87161a;
}

.cardAmir {
    direction: ltr;
}

.form-check-input {
    border: 1px solid rgba(0,0,0,.3);
}

.carousel-control-prev, .carousel-control-next {
    background-color: rgba(255,255,255,.2);
}

.lovedItem {
    cursor: pointer;
}

.e-input {
    width: 100%;
    border-radius: 8px;
    background: #EDEEEF;
    border: none;
    outline: none;
    padding: 12px;
    font-size: 20px;
    max-height: 45px;
    color: rgba(0,0,0,.8) !important;
    transition: all ease .3s;
    outline: 1px solid transparent;
    font-weight: bold;
    direction: rtl;
}

.f-Edit-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px;
    background-color: #22668D;
    border-radius: 50%;
    cursor: pointer;
    transition: all ease-in-out .2s;
    z-index: 1;
}

    .f-Edit-btn:hover {
        box-shadow: 0 0 10px #1d4e79;
    }

    .f-Edit-btn:active {
        background-color: #1d4e79;
        transform: scale(.95);
    }

    .f-Edit-btn > i {
        color: #fff;
        font-size: 16px;
    }

#SunBtnPage5 {
    transition: all ease .3s;
}


.tooman {
    width: 25px;
}

.adscrusel {
}

    .adscrusel image {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.messages {
    color: red;
}



/* -----KeyFrams----- */
@keyframes pictures {
    0% {
        filter: blur(0);
    }

    50% {
        filter: blur(2px);
    }

    100% {
        filter: blur(0);
    }
}

@keyframes produsts {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-4px);
    }

    100% {
        transform: translateY(0);
    }
}