@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200..1000&display=swap');

@font-face {
    font-family: 'DINNextLTArabic';
    src: url('../../font/din-next-lt-arabic-b4fd9f01e2/ArbFonts.com-\(21\)/ArbFONTS-DINNextLTArabic-Regular-4.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

body {
    direction: rtl !important;
    text-align: right !important;
    font-family: 'Cairo', sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.title,
.hero h1,
.our-agencies-facts-number-item h3,
.faqs-content h2,
.media-card-text h3,
.media-main-card-text h3 {
  font-family: "DINNextLTArabic", serif !important;
}

/* RTL version of the logos slider animation */
@keyframes scroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-200px * 8)) !important; /* Move in positive direction for RTL */
    }
}

/* RTL-specific adjustments for logos slider */
.logos-track {
    direction: ltr; /* Keep logos in their original orientation */
    width: 100% !important;
    animation-direction: reverse !important; /* Reverse the animation for RTL */
}

.home-about-content-image .home-about-content-image-img-2 {
    left: -4rem !important;
    right: unset !important;
}

.media-main-card-text-date-view-more {
    right: unset !important;
    left: -10rem !important;
    transition: all 0.3s ease;
}

.media-main-card:hover .media-main-card-text-date-view-more {
    right: unset !important;
    left: 1rem !important;
    transition: all 0.3s ease;
}

.chairman-bg {
    right: 0;
    left: unset;
    clip-path: polygon(0% 65%, 100% 0, 100% 50%, 100% 100%, 0% 100%);
}

.mission-swiper-buttons {
    right: 1.5rem;
    left: unset;
}

.projects-oval {
    background-color: #F8F8F8;
    padding: 5rem 0;
    position: relative;
    overflow: hidden;
    z-index: 1;
    background-image:  url("../../img/city\ oval\ 2.png"),url("../../img/all\ 22\ \(1\).png");
    background-size: auto, 40% 100%;
    background-position: center left, center left;
    background-repeat: no-repeat, no-repeat;
}

.projects-oval-bg {
    position: absolute;
    top: 0;
    right: 0;
    width: 35%;
    height: 100%;
    background-color: #212121;
    clip-path: polygon(45% 0, 100% 0, 100% 50%, 100% 100%, 0 100%, 0% 50%);
    z-index: -1;
}

.projects-city-content-image {
    right: unset;
    left: 0;
    height: 100%;
}

.projects-city-content-image img {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 40%;
    border-top-right-radius: 40%;
}

.job-requirements li:before {
    right: 0 !important;
    left: unset !important;
}

.oval-about-image {
    right: 0;
    left: unset;
}

.oval-about-content-number {
    left: 50%;
}

.city-about-content-image img {
    top: 0;
    right: unset;
    left: 0;
    border-top-left-radius: 0%;
    border-bottom-left-radius: 0%;
    border-top-right-radius: 40%;
    border-bottom-right-radius: 40%;
}

.city-cozy {
    background-position: left;
}

.privacy-list li:before,
.terms-list li:before {
    left: unset;
    right: 0;
}

.home-contact-bg {
    clip-path: polygon(42% 0, 100% 0, 100% 50%, 100% 100%, 0 100%, 0% 50%);
}

.loyalty-image img {
    right: unset;
    left: 2rem;
}

.login-content-image {
    clip-path: polygon(0 0, 60% 0, 100% 50%, 100% 100%, 0 100%, 0% 50%);
    right: unset;
    left: 0;
    width: 55%;
}

.password-toggle-icon {
    right: unset;
    left: 12px;
}










@media (max-width: 768px) {
    .home-about-content-image .home-about-content-image-img-2 {
        left: 0 !important;
        right: unset !important;
    }

    .mobile-menu .offcanvas-body ul li img{
        transform: rotate(90deg) !important;
    }

    .projects-city-content-image img {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        max-width: 100%;
    }

    .oval-about-content-number {
        left: 0 ;
    }

    .city-about-content-image img {
        border-top-left-radius: 0%;
        border-bottom-left-radius: 0%;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }
}