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

body {
	font-family: "Cairo", serif;
}

p, h1, h2, h3, h4, h5, h6, a {
	font-family: "Cairo", serif;
}

.header-top::before {
	left: 0; 
	right: auto;
}

.header-top {
	direction: rtl;
}

.header-top-list a i {
    margin-right: 0;
    margin-left: 5px;
}

.dropdown-toggle::after {
    margin-right: .255em;
    margin-left: 0;
}

.header-top-social a {
    margin-right: 14px;
    margin-left: 0;
}

.main-navigation {
	direction: rtl;
}

.sidebar-popup {
	direction: rtl;
}

.sidebar-popup .btn-close {
	margin-right: auto;
	margin-left: 0;
}

.feature-area, .about-area, .service-area, .choose-area, .footer-area, .site-breadcrumb, .contact-area, .process-area {
	direction: rtl;
}

.feature-item .count {
    right: 20px;
	left: auto;
}

.feature-icon::before {
	display: none;
}

.service-icon {
	margin: 0px auto 20px auto;
}

.service-title {
	text-align: center;
}

.service-item {
	padding: 30px 20px;
}

.site-title-tagline {
	padding: 2px 3px 2px 15px;
}

.site-title-tagline i {
	margin-left: 5px;
	margin-right: 0;
}

.about-experience {
    left: 50px;
    right: auto;
	padding: 14px 55px;
}

.hero-single .hero-content {
	direction: rtl;
}

.footer-widget-box.about-us {
    margin-left: 50px;
    margin-right: 0;
}

.footer-widget-title::before {
	left: auto;
	right: 0;
}

.footer-list li a:hover {
    margin-right: 0px;
    margin-left: 0px;
    color: var(--theme-color);
}

.footer-list li a i {
    margin-left: 5px;
    margin-right: 0;
}

.footer-list li a {
    transition: var(--transition);
    position: relative;
    margin-right: -20px;
    margin-left: 0;
}

.site-breadcrumb .breadcrumb-menu li::before {
    content: '\f100';
    font-family: 'Font Awesome 6 Pro';
    left: -21px;
    right: auto;
}
.site-breadcrumb .breadcrumb-menu li {
    margin-left: 0;
    margin-right: 25px;
}

.skill-area {
	direction: rtl;
}

.site-breadcrumb .breadcrumb-menu li:first-child {
    margin-left: 0;
    margin-right: 0;
}

.process-item .icon {
    left: 0;
    right: auto;
    border-radius: 10px 50px 50px 50px;
}

@media (min-width: 992px) {
    .nav-right {
        margin-right: 45px;
        margin-left: 0;
    }
}