.rtl{
    direction: rtl;
}
.w-100{
    width: 100%;
}
.w-30{
    width: 30%;
}
.w-40{
    width: 40%;
}
.w-50{
    width: 50%;
}
.w-60{
    width: 60%;
}
.p-5{
    padding: 5%;
}
.m-2-5{
    margin:2.5%;
}
.f-r{
    float: right;
}
.c-b{
    clear: both;
}
.f-l{
    float: left;
}
.m-2{
    margin: 20px;
}
.mt-4{
    margin-top: 40px;
}
.p-1{
    padding: 10px;
} 
.flex{
    display: flex;
} 
.ai-c{
    align-items: center;
} 
.jc-c{
    justify-content: center;
}
.bs-red
{
    color: var(--bs-red);
}
.center{
    text-align: center;
}
img{
    height: auto;
    width: 100%;
    max-width:100%;
    max-height:100%; 
    object-fit: cover;
}
img:hover {
    filter: brightness(60%);
    -webkit-filter: brightness(60%);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}
.hover:hover{
    filter: brightness(60%);
    -webkit-filter: brightness(60%);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}
.grey{
    background-color: rgb(247, 247, 247);
}
.cartIcon,.favorateListIcon{
    color: var(--color-secondary);
    color: var(--color-grey-light-2);
    font-size: x-large;
    margin: 5px;
}
.cartIcon:hover, .favorateListIcon:hover{
    color: var(--color-secondary);
    cursor: pointer;
}