html,
body {
    overflow-x: hidden !important;
    margin: 0 !important;
    padding: 0px !important;
    scroll-padding-top: 80px;
    color: white;
    background-color: #010324 !important;
    scroll-behavior: smooth;
    font-family: "Raleway", sans-serif !important;
}

.main-arrow {
    font-size: 21px !important;
    font-weight: 700 !important;
}
.request-service-container .form-control {
    box-shadow: none !important;
}

#newsletter .subscribe-input {
    border-left: 0 !important;
    border-radius: 0 !important;
}
#newsletter .subscribe-input:focus {
    background: #2c2e42 !important;
    border-radius: 0 !important;
}
#resumeModal .row-job-modal {
    --bs-gutter-x: 2rem !important;
}
#resumeModalLabel.modal-title {
    color: black;
    font-size: 1.5rem;
    padding: 1rem 0;
    padding-bottom: 2rem;
}
.container.ceo-main-container {
    background-image: url("../images/ceo-background.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: 47%;
    max-width: 1296px !important;
    position: absolute;
    z-index: 0;
    left: 15%;
    top: 45px;
    transition: background 0.3s, border 0.3s, border-radius 0.3s,
        box-shadow 0.3s;
    margin-top: -32px;
    margin-bottom: 0px;
    padding: 94px 89px 127px 89px;
}
.top-ceo-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 0;
    margin-top: 3.35rem;
}
.top-ceo-container .title-container {
    display: flex;
    align-items: center;
}
.top-ceo-container h2 {
    font-size: 32px;
    font-weight: 300;
    line-height: 32px;
    margin: auto 0.65rem;
}
.top-ceo-container .btn {
    border-radius: 7px !important;
}
.top-ceo-container .btn i {
    margin: auto 5px;
}
.container.ceo-cards-container {
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url("../images/ceo-cards-bg.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 10px !important;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #bfbfc0;
    transition: background 0.3s, border 0.3s, border-radius 0.3s,
        box-shadow 0.3s;
    margin-top: 23px;
    margin-bottom: 0px;
    padding: 26px 15px;
    position: relative;
    z-index: 0;
    margin-top: 2rem;
    max-width: 1297px !important;
}
.internal-cards-container {
    max-width: 1140px;
}
.ceo-cards-container img {
    max-width: 100%;
    height: auto;
}

/* SMALL SCREEN */
@media (max-width: 758px) {
    /* English */
    html[lang="en"] #home_achievements #dynamic-title-container h1 {
        font-size: 21px !important;
        font-weight: 700 !important;
        line-height: 21px !important;
    }
    html[lang="en"] #home_achievements .res-desc {
        font-size: 15px;
        font-weight: 400;
        line-height: 21px;
        width: 102%;
        margin-left: -0.3rem !important;
    }
    html[lang="en"] #home_achievements .home-title-container {
        margin-top: 0.75rem !important;
    }
    html[lang="en"] #home_achievements .cert-img {
        margin: auto 0 !important;
        margin-top: 0.75rem !important;
    }
    html[lang="en"] #home_achievements .statistics {
        padding-top: 6rem !important;
    }
    html[lang="en"] .navbar {
        padding: 0 1.7rem !important;
    }
    html[lang="en"] .brand-container {
        padding: 0 1rem !important;
        padding-bottom: 0.35rem !important;
    }
    html[lang="en"] .navbar .left-side {
        margin-right: -9px !important;
    }
    html[lang="en"] #products .swiper-slide {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    html[lang="en"] #feedbacks .img-container {
        display: flex;
        justify-content: center;
    }
    html[lang="en"] #feedbacks .img-container img {
        width: 38% !important;
        margin-bottom: 0 !important;
    }
    html[lang="en"] #feedbacks {
        margin-top: 4.2rem !important;
    }
    html[lang="en"] #learn-more .learn-more-img {
        width: 39% !important;
        height: 19% !important;
    }
    html[lang="en"] #learn-more .learn-more-p {
        font-size: 19px;
        font-style: normal;
        font-weight: 700;
        line-height: 28.5px;
    }
    html[lang="en"] #services .services-img {
        width: 32%;
        height: 81%;
    }
    html[lang="en"] #services .service-title {
        font-size: 16px;
        font-weight: 700 !important;
        line-height: 19.2px;
    }
    html[lang="en"] #suppliers .main-supp-img {
        height: 32px !important;
    }
    html[lang="en"] #suppliers .moon-supplier {
        top: 0;
        left: 0;
        right: unset !important;
    }
    html[lang="en"] #suppliers .sun-supplier {
        max-width: 23px;
        bottom: -88px !important;
        right: 0;
        left: unset !important;
    }
    html[lang="en"] #partners2 .partner-p-l {
        box-sizing: border-box;
        color: rgb(255, 255, 255);
        font-family: "Raleway", sans-serif;
        font-size: 17px !important;
        font-weight: 600;
        line-height: 20.4px;
    }
    html[lang="en"] #partners2 .starts-partner-img {
        display: block !important;
        top: 24px;
        right: -32px;
    }
    html[lang="en"] .jobs-main-img {
        width: 94px;
        height: 33.66px;
    }
    html[lang="en"] .jobs-title {
        font-size: 20px;
        font-weight: 300;
        line-height: 20px;
    }
    html[lang="en"] #clients-mobile .client-title {
        font-size: 22px !important;
        font-weight: 700 !important;
        line-height: 35.2px !important;
    }
    html[lang="en"] #jobs .sun-jobs-img {
        display: none !important;
    }
    html[lang="en"] #jobs .job-date {
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
    }
    html[lang="en"] #jobs .job-date i {
        margin: auto 0.35rem !important;
    }
    html[lang="en"] #jobs .jobs-card-desc {
        font-size: 11px !important;
        font-weight: 400;
        line-height: 26px !important;
    }
    html[lang="en"] #jobs .jobs-row {
        padding: 0 0.25rem !important;
    }
    html[lang="en"] #jobs .watch-more-job-container {
        margin-top: 2rem !important;
        margin-bottom: 8rem !important;
    }
    html[lang="en"] .request-service-container {
        padding: 0 !important;
    }
    html[lang="en"] .request-service-container label {
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 21px !important;
    }
    html[lang="en"] #request-service .form-control {
        background-color: rgba(255, 255, 255, 0);
        border-bottom-color: rgb(105, 114, 125);
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        border-bottom-style: solid;
        border-bottom-width: 1px;
        border-image-outset: 0;
        border-image-repeat: stretch;
        border-image-slice: 100%;
        border-image-source: none;
        border-image-width: 1;
        border-left-color: rgb(105, 114, 125);
        border-left-style: solid;
        border-left-width: 1px;
        border-right-color: rgb(105, 114, 125);
        border-right-style: solid;
        border-right-width: 1px;
        border-top-color: rgb(105, 114, 125);
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        border-top-style: solid;
        border-top-width: 1px;
        box-sizing: border-box;
        color: rgb(255, 255, 255);
        flex-basis: 100%;
        flex-grow: 1;
        font-family: "Roboto", Roboto, Cairo, sans-serif;
        font-size: 15px;
        font-weight: 400;
        line-height: 21px;
    }
    html[lang="en"] footer {
        padding-top: 3.5rem;
    }
    html[lang="en"] footer .sub-img {
        width: 39% !important;
    }
    html[lang="en"] footer .footer-last-hinter {
        font-size: 19px !important;
        font-weight: 600 !important;
        line-height: 30.4px !important;
        max-width: 100% !important;
    }
    html[lang="en"] #newsletter .subscribe-input {
        border-radius: 5px 0 0 5px !important;
        border: 1px solid #c4c6e2;
        border-left: 1px solid #c4c6e2 !important;
        padding: 16px;
        font-weight: normal;
        font-size: 13px;
        text-align: left;
        color: #17192f;
        opacity: 0.5;
        font-family: "cairo";
        background-color: #2c2e42;
        text-align: left !important;
    }
    html[lang="en"] .copyright-container a {
        font-size: 15px !important;
        font-weight: 500 !important;
        line-height: 15px !important;
        text-align: center !important;
        margin-bottom: 1.5rem !important;
    }
    html[lang="en"] footer .policy-container {
        flex-direction: column !important;
        align-items: center !important;
        justify-content: space-between !important;
    }
    html[lang="en"] #products .divider {
        margin: 2rem 0 !important;
    }
    html[lang="en"] #products {
        scroll-margin-top: -1.85rem !important;
    }

    /* Arabic */
    body {
        margin-top: 32px !important;
    }
    .navbar .nav-link {
        padding: 9px 0 !important;
    }
    #home_achievements .cert-img {
        max-height: 62px !important;
        height: auto !important;
        width: auto !important; /* or 100% if responsive */
    }

    .brand-container {
        display: flex;
        align-items: center;
        width: 100%;
        justify-content: space-between;
        padding-bottom: 0.35rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
        padding-bottom: 0.45rem !important;
    }
    /* from outside under test */
    .brand-img {
        margin-right: 0.9rem !important;
    }
    .btn-mobile {
        padding: 0.75rem 1rem;
    }

    .testimonialsSwiper .swiper-pagination-bullet {
        background: #ffffff4d !important;
        width: 12px;
        height: 12px;
    }

    .brand-img {
        min-width: 91.83px !important;
        height: 39.36px !important;
    }
    .blogs-desc-sm {
        padding-top: 0.5rem !important;
    }
    .testimonialsSwiper
        .swiper-pagination-bullet.swiper-pagination-bullet-active {
        background: var(--bs-primary) !important;
    }
    .sun-jobs-img {
        top: 68px !important;
        left: 32px !important;
        width: 39px !important;
    }

    .icon-nav {
        background-color: unset !important;
        font-size: 27px !important;
        width: 40px !important;
        height: 40px !important;
    }
    .container-sm {
        max-width: 100% !important;
        padding-right: 0.1rem !important;
        padding-left: 0.1rem !important;
    }
    .mayor-img {
        margin-top: 0.95rem;
        margin-bottom: 0.4rem;
    }

    /* from outside under test */
    #home_achievements {
        /* max-width: 466px !important; */
        max-width: 89% !important;
        padding-top: 78px !important;
        margin-top: 1.27rem;
    }
    #contact-us-form p {
        font-size: 17px !important;
        color: #f7f8f8 !important;
    }
    #contact-us-form {
        padding: 27px 0 !important;
        margin: 4rem 0 !important;
    }
    .product-title {
        font-size: 20px !important;
        line-height: 30px !important;
    }
    #request-service .req-md-custom {
        padding: 0 1.25rem !important;
        margin-bottom: 0rem !important;
    }
    #request-service .btn {
        width: 100% !important;
    }
    .job-info .btn {
        position: unset !important;
    }
    .stat-icon img {
        width: 75px !important;
    }
    footer .footer-line-img {
        margin-top: 2.75rem !important;
        margin-bottom: 0.75rem !important;
    }
    .mayors-p {
        width: 82% !important;
    }
    footer .policy-container {
        justify-content: center !important;
    }
    .res-desc {
        color: #c8c8c8 !important;
    }
    #blogs {
        max-width: 84% !important;
        line-height: inherit;
    }
    .jobs-main-img {
        margin-bottom: 1.2rem !important;
    }
    .footer-slogan {
        font-size: 13px !important;
        line-height: 13px !important;
        margin: 1.2rem auto !important;
    }
    /* scroll-margin-top */
    #mayors {
        scroll-margin-top: -90px !important;
    }
    #clients-mobile {
        scroll-margin-top: -50px !important;
    }
    #services {
        scroll-margin-top: -80px !important;
    }
    #products {
        scroll-margin-top: 20px !important;
    }
    #blogs {
        scroll-margin-top: -60px !important;
    }
    #jobs {
        scroll-margin-top: -12px !important;
    }
    /* scroll-margin-top */
    #contact-us-form {
        scroll-margin-top: -48px !important;
    }
    #blogs .btn-container {
        margin-top: 4.2rem !important;
    }
    .blogs-title {
        font-weight: 700;
        font-size: 16.45px;
        line-height: 25.2px;
    }
    .width-partner-sm {
        width: 93% !important;
    }
    .res-desc {
        font-size: 13px;
    }
    .suppliers-swiper-img {
        max-width: 80px;
    }
    .moon-low {
        display: none !important;
    }
    .statistics {
        padding-top: 1rem;
    }
    footer .footer-last-hinter {
        max-width: 70% !important;
    }
    .copyright-container {
        margin: 0.85rem 0.5rem !important;
        padding-top: 0.85rem !important;
        padding-bottom: 2.55rem !important;
        font-size: 15px !important;
    }
    .sun-supplier-blog {
        display: none !important;
    }
    .starts-footer-img {
        display: none !important;
    }

    .responsive-padding-sm-nav {
        padding: 0 0.2rem;
    }
    #newsletter input {
        min-width: 235px !important;
        height: 48px !important;
        width: 100% !important;
    }
    .navbar {
        padding: 0 1.17rem !important;
    }
    .navbar-toggler {
        border-radius: 0.375rem !important;
        padding: 4px 8px !important;
    }
    .services-img {
        margin-bottom: 1.45rem !important;
    }
    .lang-icon {
        margin-left: 0.4rem !important;
    }
    .img-holder .truncate-line-2 {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        line-clamp: 1;
        -webkit-line-clamp: 1;
        width: 87%;
    }

    #products {
        margin-top: 7rem !important;
    }
    .lang-sympol {
        margin-left: -3px !important;
    }
    .img-holder .overlay .icon-prod {
        position: absolute;
        top: 40%;
        left: 45%;
        width: 45px;
        height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
        outline: 1px solid #fff;
        border-radius: 50%;
        font-size: 18px;
        margin: 0 auto 45px;
    }
    .img-holder .product-card .title {
        font-size: 20px !important;
        /* font-weight: 500 !important; */
        line-height: 24px !important;
        /* margin-bottom: 0 !important; */
    }
    .product-card .overlay {
        padding-bottom: 1rem !important;
        right: -9px !important;
        left: unset !important;
    }
    .img-holder .overlay .icon-prod:hover {
        cursor: pointer;
    }

    #newsletter .btn-yellow {
        width: 100% !important;
        min-width: 114px !important;
    }
    #newsletter .subscribe-input {
        height: 46px !important;
        min-width: 235px !important;
    }
    #newsletter .btn-yellow i {
        margin: 0 6px !important;
    }
    .icns-sm-container {
        overflow: hidden !important;
    }
    .job-info {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-bottom: 0.75rem;
    }
    #resumeModalLabel.modal-title {
        font-size: 1.2rem !important;
        padding: 1rem 0 !important;
        padding-bottom: 1.2rem !important;
    }
    #blogs .relative-blog {
        margin-bottom: 4.6rem !important;
    }
    .cust-jobs-cont {
        align-items: center !important;
    }
    .partner-p-l {
        padding: 0 0.5rem !important;
    }

    .navbar::after {
        top: 90px;
        max-width: 90%;
        margin: 0 auto;
        left: 0;
        right: 0;
    }
    .last-footer {
        font-size: 14px !important;
    }

    #mayors {
        padding: 0 1.35rem;
    }
    #jobs {
        margin-top: 8rem;
        padding: 0 2rem;
        margin-bottom: 4rem;
    }
    .moon-none {
        display: none !important;
    }
    .cards-sun {
        top: -40px !important;
    }
    .badge-sm {
        height: 27px !important;
        border-radius: 100px !important;
        border: solid 0.8px rgba(255, 255, 255, 0.12) !important;
        padding: 7px !important;
        /* margin: 0 5px !important; */
        font-size: 7px !important;
        text-align: center !important;
    }
    .jobs-title {
        font-size: 20px;
    }
    .jobs-row {
        padding: 0 1.25rem !important;
    }
    .job-card {
        height: 320px !important;
    }
    .watch-more-job-container {
        margin-top: 6.2rem !important;
    }
    .starts-partner-img {
        display: none !important;
    }
    .job-date {
        line-height: 24px;
        color: #ffffff;
        text-align: center;
    }
    .blogs-desc-sm {
        color: rgba(255, 255, 255, 0.82) !important;
        width: 103% !important;
    }
    /* company video page */

    .video-title {
        font-size: 27px;
        font-weight: 300;
        line-height: 27px;
        text-align: center;
        margin: 2.8rem auto;
        margin-bottom: 2.8rem;
        margin-bottom: 0.3rem !important;
    }
    .testimonials-img {
        height: auto !important;
    }

    .company-video-container .video {
        opacity: 1;
        max-height: 463px;
        object-fit: cover;
        margin-top: 2.2rem;
        border-color: #fff !important;
        border-radius: 15px !important;
        border-width: 2.6px !important;
        margin-bottom: 4.3rem !important;
        min-height: 280px !important;
    }
    .container.ceo-main-container {
        position: unset !important;
        max-width: 94% !important;
        margin-top: -1px !important;
    }
    .news-img {
        z-index: unset !important;
    }
    .top-ceo-container {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-top: -8.65rem;
    }
    .title-container {
        margin-bottom: 1.4rem !important;
    }
    .top-ceo-container h2 {
        font-size: 19px;
        font-weight: 300;
        line-height: 19px;
    }
    /* .testimonials-img {
        aspect-ratio: 4 / 3 !important;
        width: auto !important;
        height: auto !important;
        object-fit: cover !important;
    } */

    .jobs-card-desc {
        font-size: 14px !important;
        line-height: 26px !important;

        display: -webkit-box !important;
        -webkit-line-clamp: 3 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .internal-cards-container img {
        max-width: 100%;
        height: auto;
    }
    .container.ceo-cards-container {
        max-width: 94% !important;
        margin-bottom: 8.62rem !important;
    }
    .internal-cards-container {
        --bs-gutter-y: 1.25rem !important;
        padding: 0 0.65rem !important;
    }
}
.job-title {
    font-size: 1.125rem;
    text-align: center;
}
.job-date {
    font-size: 14px;
}
.job-card-title {
    line-height: unset;
}

.job-btn-container a {
    font-size: 13px !important;
    padding-left: 1.75rem !important;
    padding-right: 1.75rem !important;
}

.contact-card {
    border-width: 3px 3px 3px 3px !important;
    border-color: #848484 !important;
    transition: background 0.3s, border 0.3s, border-radius 0.3s,
        box-shadow 0.3s !important;
    padding: 30px !important;
}
.request-service-title {
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4em;
    margin-top: 0;
}
.request-service-container {
    padding: 0 2rem;
}

.request-service-container .form-control {
    border: 1px solid #69727d;
    box-shadow: none !important;
}

footer .footer-map {
    margin-top: 0 !important;
}
#newsletter input {
    width: 100% !important;
    border-radius: 5px 0 0 5px !important;
    background: transparent !important;
    background-color: #2c2e42 !important;
    border: 1px solid #c4c6e2 !important;
    padding: 16px !important;
    font-weight: normal !important;
    font-size: 13px !important;
    text-align: right !important;
    color: #17192f !important;
    font-family: "cairo" !important;
}

footer ul li {
    font-size: 14px !important;
    font-weight: 400 !important;
}

footer .policy-container {
    margin-top: 0 !important;
    margin-bottom: 1.5rem !important;
    flex-direction: row !important;

    align-items: center !important;
    font-size: 15px !important;
}
.contact-us-button {
    display: inline-block !important;
    line-height: 1 !important;
    background-color: #69727d !important;
    font-size: 15px !important;
    padding: 12px 24px !important;
    border-radius: 3px !important;
    color: #fff !important;
    fill: #fff !important;
    text-align: center !important;
    transition: all 0.3s !important;
    font-weight: 500 !important;
    background-color: #ee9919 !important;
}

.statistics {
    padding-top: 4.5rem !important ;
}
.products-title-img {
    margin-top: 0.5rem !important;
}

.request-service-container label {
    font-weight: bold;
}

.jobs-card-desc {
    font-size: 14px;
    line-height: 26px;
}
.watch-more-job a {
    font-size: 19px;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.custom-h2-t6 {
    max-width: 21rem;
    line-height: 1.5;
}
.mayors-p {
    width: 82%;
}

.mayor-profile-btn {
    font-size: 1.125rem;
}
.client-title {
    line-height: 1.6em;
    margin-top: 4.2rem !important;
}
.learn-more-img {
    width: 41% !important;
    height: 34% !important;
    margin: auto !important;
}
#learn-more .row {
    --bs-gutter-x: 0rem !important;
}
.service-btn {
    width: unset !important;
}
.watch-more-client-btn {
    max-width: 68%;
    margin: auto;
}
#clients .slider-wrapper {
    margin-top: 2.5rem !important;
    padding: 0 2rem !important;
}
.divider {
    height: 8px !important;
    margin: 3.5rem 0;
}
.mayor-profile-btn {
    padding: 0.175rem 0.75rem !important;
}
.profile-mayor-btn {
    border-radius: 9px !important;
}
.product-title {
    font-size: 20px;
    line-height: 1.5em;
}
.mayors-video-container {
    margin-top: -0.5rem !important;
}
.swiper-pagination-bullet {
    margin: 0 6px !important;
}
.products-btn {
    margin: auto !important;
    padding-top: 0.95rem !important;
    padding-bottom: 0.95rem !important;
}
.sun {
    right: -22px !important;
}
.products-btn i {
    margin: 0 6px !important;
}
.products-btn.gradient-border-btn::before {
    padding: 1.5px !important;
}
.services-btn {
    padding-top: 0.925rem !important;
    padding-bottom: 0.925rem !important;
}

.jobs-main-img {
    width: 94px;
    height: 45px;
}
.sun-jobs-img {
}
.services-btn i {
    margin: 0 6px !important;
}
.learn-more-p {
    font-size: 19px !important;
    margin-bottom: 1.5rem !important;
}
.learn-more-section {
    padding: 1.125rem 0 !important;
    padding-bottom: 3.25rem !important;
}
#learn-more .container {
    max-width: 636px;
}
#feedbacks {
    margin-bottom: 4.5rem !important;
}
#mayors .more-about {
    padding: 0.75rem !important;
}

.home-title-container {
    padding: 0 1rem !important;
}

.icns-sm-container {
    margin-top: 1.4rem !important;
}

/* LARGE SCREEN */

@media (min-width: 1116px) {
    /* English */
    html[lang="en"] body {
        margin-top: 120px !important;
    }
    html[lang="en"] #home_achievements .icon-heading i {
        font-size: 20px !important;
    }
    html[lang="en"] #home_achievements h1 {
        font-size: 39px !important;
        line-height: 39px !important;
        margin-bottom: 0.85rem !important;
    }
    html[lang="en"] #home_achievements h1:first-of-type {
        margin-bottom: 0.75rem !important;
    }
    html[lang="en"]
        #home_achievements
        #dynamic-title-container
        h1:nth-of-type(2) {
        font-size: 40px !important;
        line-height: 40px !important;
    }
    html[lang="en"] #home_achievements .icns-sm-container {
        margin-left: -0.4rem !important;
        margin-top: 1.75rem !important;
    }
    html[lang="en"] #home_achievements .icon-heading {
        margin-bottom: 0 !important;
    }
    html[lang="en"] #home_achievements .res-desc {
        max-width: 689px !important;
        width: 113%;
        margin-left: -2rem !important;
        margin-top: 0px !important;
    }
    html[lang="en"] #home_achievements .cert-img {
        margin: auto 0 !important;
    }

    html[lang="en"] #home_achievements .statistics {
        padding-top: 2rem !important;
        width: 128.25% !important;
        margin-right: -7.89rem !important;
        margin-top: 0.78rem !important;
    }

    html[lang="en"] .home-title-container {
        width: 76% !important;
        margin-top: 0 !important;
    }
    html[lang="en"] #home_achievements .statistics {
        padding-top: 4rem !important;
        width: 149.25% !important;
        margin-left: -13.75rem !important;
        margin-top: 0.78rem !important;
    }
    html[lang="en"] #home_achievements .stat-item {
        min-width: 130px !important;
        margin-left: 0 !important;
    }
    html[lang="en"] #home_achievements .stat-last-txt {
        width: 99% !important;
    }
    html[lang="en"] .lng-span-container {
        display: flex !important;
        align-items: center !important;
        justify-content: space-around !important;
    }
    html[lang="en"] .lng-span-container span {
        font-size: 0.9rem;
        order: 2;
        margin: auto 0.2rem;
    }
    html[lang="en"] .btn-service {
        font-size: 12px !important;
        padding: 10px 25px !important;
    }
    html[lang="en"] .navbar-nav > li:first-child a {
        margin-right: 0 !important;
    }
    html[lang="en"] .product-card .overlay {
        padding-bottom: 1rem !important;
        left: -9px !important;
        right: unset !important;
    }
    html[lang="en"] .navbar {
        height: 82px !important;
    }
    html[lang="en"] .brand-container {
        margin-right: -2.25rem !important;
    }
    html[lang="en"] .navbar .container {
        margin-left: 25.6rem !important;
    }
    html[lang="en"] .navbar::after {
        top: 81px !important;
    }
    html[lang="en"] header .brand-img {
        width: 90.4px !important;
        height: 38.78px !important;
        margin-bottom: 0.4rem !important;
    }
    html[lang="en"] .navbar-expand-lg .navbar-nav {
        margin-left: 4rem !important;
    }
    html[lang="en"] .social-icns-container {
        left: -9.75rem !important;
        top: 36% !important;
    }

    html[lang="en"] #home_achievements {
        padding-top: 151px !important;
        max-width: 867px !important;
    }
    html[lang="en"] #mayors .custom-h2-t6 {
        font-size: 28px !important;
        line-height: 36.4px !important;
        max-width: 100% !important;
        margin-top: 0.35rem !important;
    }
    html[lang="en"] .clients-main-title {
        font-size: 32px !important;
        line-height: 32px !important;
    }
    html[lang="en"] #clients {
        /*margin-right: 20rem !important;*/
        padding-bottom: 6.3rem !important;
    }
    html[lang="en"] .products-title-img {
        width: 145.6px !important;
        height: 46.9px !important;
    }
    html[lang="en"] .services-img {
        width: 145.6px !important;
        height: 46.9px !important;
    }
    html[lang="en"] .services-title {
        font-size: 24px !important;
        max-width: 90%;
        line-height: 24px !important;
        margin-left: 1.65rem;
    }
    html[lang="en"] .about-top-container {
        margin: 2rem auto !important;
        margin-top: 2rem;
        margin-top: 0 !important;
    }
    html[lang="en"] .about-top-container .about-text-container {
        padding-left: 0 !important;
        margin-left: 0 !important;
    }
    html[lang="en"] .about-top-container h2 {
        line-height: 40px !important;
    }
    html[lang="en"] .about-top-container p {
        margin-bottom: 2.5rem !important;
    }
    html[lang="en"] .custom-pad .col-md-6 p:nth-of-type(2) {
        text-align: right !important;
    }
    html[lang="en"] .about-ceo-part .divider.first {
        display: none !important;
    }

    html[lang="en"] .about-position-relative .about-moon {
        left: unset !important;
        bottom: 27px;
        right: 35px;
        left: unset !important;
        max-width: 73px !important;
    }
    html[lang="en"] .first-about-container .bread {
        position: relative;
        top: -24px;
    }
    html[lang="en"] .about-top-container .video-container {
        margin-top: 2rem !important;
    }
    html[lang="en"] .about-ceo-part .col-md-6:nth-of-type(2) img {
        opacity: 1;
        position: absolute;
        width: 430px;
        height: 413px;
        top: 27px;
        right: 68px;
        left: unset !important;
    }
    html[lang="en"] .about-ceo-part .row .col-md-6:nth-of-type(1) {
        width: 50%;
        margin-left: -8.79rem;
        margin-right: unset !important;
    }

    html[lang="en"] #services .sun {
        width: 103px !important;
        top: -31px !important;
        right: -21px !important;
    }
    html[lang="en"] #services .moon {
        bottom: 0px !important;
        left: -12px !important;
    }
    html[lang="en"] #services .moon-low {
        /* right: -20px !important; */
        bottom: -19px !important;
        left: -18px !important;
    }
    html[lang="en"] #services .yellow-donut {
        bottom: -4.5rem !important;
    }
    html[lang="en"] .services-btn {
        width: 243px !important;
    }
    html[lang="en"] #services .fixed-width {
        overflow: hidden !important;
    }
    html[lang="en"] .service-card {
        padding: 23px 20px !important;
    }
    html[lang="en"] .no-width {
        margin-left: 0.5rem !important;
        margin-top: 22px !important;
    }
    html[lang="en"] #services .service-title {
        font-size: 17px !important;
        font-weight: 700 !important;
        line-height: 25.5px !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        line-clamp: 2 !important;
        -webkit-line-clamp: 1 !important;
    }
    html[lang="en"] #products .swiper-slide {
        margin: auto 0 !important;
        margin-right: 20px !important;
    }
    html[lang="en"] .blogs-img {
        height: 47px !important;
        margin-bottom: 0.5rem !important;
    }
    html[lang="en"] #blogs .jobs-blogs-btn {
        bottom: 4px !important;
    }
    html[lang="en"] #blogs .sun-supplier-blog {
        left: 635px !important;
    }
    html[lang="en"] #blogs .card-title {
        font-size: 17px !important;
        font-weight: 700 !important;
        line-height: 25.5px !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        text-overflow: ellipsis;
        line-clamp: 3 !important;
        -webkit-line-clamp: 2 !important;
    }
    html[lang="en"] #blogs .card-text {
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        text-overflow: ellipsis;
        line-clamp: 3 !important;
        -webkit-line-clamp: 3 !important;
    }
    html[lang="en"] #jobs .sun-jobs-img {
        display: none !important;
    }
    html[lang="en"] #jobs .jobs-title {
        font-size: 32px !important;
        font-weight: 300 !important;
        line-height: 32px !important;
    }
    html[lang="en"] #jobs .jobs-p {
        width: 59% !important;
    }
    html[lang="en"] #jobs .jobs-row {
        padding: 0 !important;
    }
    html[lang="en"] #jobs .cust-jobs-cont {
        margin-bottom: 0 !important;
    }
    html[lang="en"] #jobs .jobs-row {
        margin-top: 2rem !important;
    }
    html[lang="en"] #jobs .jobs-blogs-btn {
        bottom: -8px !important;
    }
    html[lang="en"] #jobs .job-date {
        line-height: 24px !important;
        font-size: 16px !important;
    }
    html[lang="en"] #jobs .job-date i {
        margin: 0 0.5rem !important;
    }
    html[lang="en"] footer .footer-w-27 {
        width: 27% !important;
    }

    html[lang="en"] footer .change-p {
        width: 31% !important;
    }
    html[lang="en"] #newsletter .w-newsletter-75 {
        width: 75% !important;
    }
    html[lang="en"] #newsletter .w-newsletter-25 {
        width: 25% !important;
    }
    html[lang="en"] #newsletter .subscribe-input {
        border: 1px solid #c4c6e2 !important;
        opacity: 0.5 !important;
        border-radius: 5px 0 0 5px !important;
        text-align: left !important;
    }
    html[lang="en"] footer .starts-footer-img {
        top: -198px !important;
        right: 180px !important;
    }
    html[lang="en"] footer .policy-container {
        justify-content: space-evenly !important;
    }

    html[lang="en"] footer .sub-img {
        width: 45% !important;
    }
    html[lang="en"] footer .copyright-container {
        bottom: -3.35rem !important;
        padding-left: 0 !important;
    }
    html[lang="en"] footer .footer-sub-container {
        top: -44px !important;
    }
    html[lang="en"] footer .logo-footer-container {
        display: none !important;
    }
    html[lang="en"] footer .list-unstyled li {
        margin-bottom: 1rem !important;
    }

    html[lang="en"] footer {
        padding-top: 5.2rem !important;
        height: 670px !important;
    }
    html[lang="en"] #partners2 .custom-col {
        right: 9px !important;
        left: unset !important;
    }
    html[lang="en"] #partners2 .our-partner-img {
        width: 169px !important;
        height: 44px !important;
    }
    html[lang="en"] #partners2 .partner-p-l {
        padding-left: 0 !important;
        text-align: left !important;
        font-size: 30px !important;
        font-weight: 600 !important;
        line-height: 36px !important;
    }
    html[lang="en"] #partners2 .starts-partner-img {
        top: 7px !important;
        right: 51px !important;
    }
    html[lang="en"] #suppliers .moon-supplier {
        top: 0 !important;
        left: 0 !important;
        right: unset !important;
    }
    html[lang="en"] #suppliers .sun-supplier {
        top: 0 !important;
        left: unset !important;
        right: 0 !important;
    }
    html[lang="en"] #learn-more .learn-more-p {
        left: unset !important;
        right: -63px !important;
        top: 18% !important;
        font-size: 26px !important;
        font-style: normal !important;
        font-weight: 700 !important;
        line-height: 39px !important;
    }
    html[lang="en"] #learn-more .learn-more-top {
        top: -17% !important;
        right: -0.5% !important;
    }
    html[lang="en"] #learn-more .learn-more-desc {
        width: 99% !important;
    }
    html[lang="en"] #learn-more .learn-more-sec {
        margin-top: 7.7rem !important;
        width: 120% !important;
        margin-left: -8rem !important;
    }
    html[lang="en"] #learn-more .learn-more-sec .row {
        --bs-gutter-x: -7rem !important;
    }
    html[lang="en"] #learn-more {
        height: 506px !important;
    }
    html[lang="en"] .request-serv-p .moon {
        left: unset !important;
        right: 84px !important;
    }

    html[lang="en"] #mayors {
        scroll-margin-top: 30px !important;
    }
    html[lang="en"] #contact-us-form {
        scroll-margin-top: -30px !important;
    }
    html[lang="en"] .container.ceo-main-container {
        padding: 110px 89px 127px 89px !important;
    }

    /* Arabic */
    body {
        margin-top: 105px !important;
    }
    .fab {
        font-family: "Font Awesome 5 Brands" !important;
        font-weight: 400 !important;
    }
    nav .container {
        max-width: 1140px !important;
    }
    .navbar {
        padding: 0 !important;
        height: 104px !important;
    }
    .navbar-nav {
        margin-right: 2px !important;
        margin-top: 0.15rem !important;
    }
    .navbar .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    header .navbar {
        position: fixed !important;
        width: 100% !important;
        top: 0 !important;
        z-index: 5656 !important;
    }
    .img-holder .overlay .icon-prod {
        position: absolute;
        top: 40%;
        left: 45%;
        width: 45px;
        height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
        outline: 1px solid #fff;
        border-radius: 50%;
        font-size: 18px;
        margin: 0 auto 45px;
    }
    .img-holder .overlay .icon-prod:hover {
        cursor: pointer;
    }
    .img-holder .overlay .title {
        font-size: 20px !important;
        font-weight: 700 !important;
        line-height: 24px !important;
    }
    .img-holder .overlay .text-white {
        font-weight: 400;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        width: 92%;
    }
    .container.clientsD {
        margin-top: 2.7rem !important;
    }

    .main-supp-img {
        margin-bottom: 1.45rem !important;
    }
    .navbar-brand {
        padding-top: 0.13rem !important;
    }
    .brand-container {
        margin-right: 2.25rem !important;
    }
    .badge-lg-job {
        border-radius: 100px !important;
        border: solid 0.8px rgba(255, 255, 255, 0.12) !important;
        font-size: 10px;
        text-align: center !important;
        padding: 0.25rem;
        margin: 0 4px;
    }
    .clientsD-card {
        /* padding: 11px 15px !important; */
    }
    .modal-job-part {
        z-index: 11111111 !important;
        top: 22px !important;
    }
    .news-part-container .gradient-border-card::before {
        pointer-events: none !important;
    }
    .news-part-hr {
        height: 3px !important;
        opacity: 0.5 !important;
    }

    .news-part-title-r {
        font-size: 32px !important;
        font-weight: 900 !important;
        line-height: 32px !important;
        margin-top: -1rem !important;
        margin-bottom: 0.75rem !important;
    }
    .container.related-news-container {
        max-width: 1170px !important;
    }
    .news-part .news-img {
        z-index: 5 !important;
    }
    .news-part .gradient-border-card::before {
        z-index: 20 !important;
        cursor: pointer !important;
        pointer-events: none !important;
    }
    .news-part .card-body {
        padding: 2rem !important;
    }
    .news-part .card-title {
        margin-bottom: 2rem !important;
    }
    #products .cust-line {
        -webkit-line-clamp: 4 !important;
    }

    .btn-service {
        font-size: 14px !important;
        padding: 0.6rem 1.85rem !important;
    }
    #learn-more {
        padding: 6rem 0 !important;
        height: 398px !important;
    }

    #blogs .swiper-slide {
        width: 21.5rem !important;
    }
    #partners2 {
        position: relative !important;
    }
    #partners2 .custom-col {
        position: absolute !important;
        left: 9px !important;
        top: 1px !important;
    }
    .learn-more-top {
        top: -30% !important;
        right: 1% !important;
    }
    #services {
        scroll-margin-top: 19px !important;
    }
    #jobs {
        scroll-margin-top: -12px !important;
    }
    .services-title {
        font-weight: 700 !important;
        font-size: 2rem !important;
        margin-bottom: 2.1rem !important;
    }
    footer {
        padding: 2.4rem 5rem !important;
        padding-top: 9.85rem !important;
    }
    #home_achievements .tadawl-img {
        margin-left: 5px !important;
    }

    footer {
        margin: 5rem auto !important;
    }

    .about-ceo-part .custom-pad .row {
        position: relative !important;
    }
    .about-ceo-part .col-md-6:nth-of-type(2) img {
        opacity: 1;
        position: absolute;
        width: 430px;
        height: 413px;
        top: -50px;
        left: 68px;
    }
    .about-ceo-part .row .col-md-6:nth-of-type(1) {
        width: 50%;
        margin-right: -2.79rem;
    }
    .about-ceo-part .row .col-md-6:nth-of-type(1) p:nth-of-type(1) {
        font-size: 18px !important;
        font-weight: 400 !important;
        line-height: 27px !important;
    }

    .about-ceo-part .row .col-md-6:nth-of-type(1) p:nth-of-type(2) {
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 21px !important;
    }
    .second-divider {
        margin-top: 4.45rem !important;
    }
    .container.last-cont-about {
        margin-top: -2rem !important;
        max-width: 1342px !important;
    }
    .last-cont-about .card-clients {
        padding: 2.3rem !important;
    }
    .last-cont-about .card-clients p {
        font-size: 25px !important;
        font-weight: 700 !important;
        line-height: 32.5px !important;
    }
    .last-cont-about .card-clients img {
        min-width: 145px !important;
    }

    .relative-blog {
        margin-bottom: 1.08rem !important;
        padding: 0 0.75rem !important;
    }
    .custom-h2-t6 {
        max-width: 26rem;
        line-height: 1.6;
    }
    .job-part-title {
        font-weight: 700 !important;
        border-bottom: 1px solid !important;
        margin-bottom: 1.2rem !important;
        padding-bottom: 0.4rem !important;
    }
    .job-part-card h4 {
        font-size: 18px !important;
        font-weight: 600 !important;
        line-height: 26px !important;
    }
    .job-part-card .job-part-date {
        font-size: 14px;
        font-weight: 400;
        line-height: 24px;
        color: #ffffff !important;
    }
    .job-part-card .job-part-badge {
        border: solid 0.8px rgba(255, 255, 255, 0.12) !important;
        font-size: 10px !important;
        height: 32px !important;
    }
    .job-part-card .btn {
        padding: 0.6rem 1.75rem !important;
        font-size: 13px !important;
    }
    .job-part-row {
        padding: 0 1.85rem !important;
    }
    .title-part-section .title-decoration {
        width: 78px !important;
    }
    #resumeModal .row-job-modal {
        --bs-gutter-x: 2rem !important;
    }
    #resumeModalLabel.modal-title {
        color: black !important;
        font-size: 1.5rem !important;
        padding: 1rem 0 !important;
        padding-bottom: 2rem !important;
    }

    .job-card .card-desc {
        font-size: 14px;
        line-height: 26px;
        text-align: left !important;
    }
    #clients.large-screen-only .slider-wrapper {
        padding: 0 3rem !important;
    }
    .blogs-desc-sm {
        color: rgba(255, 255, 255, 0.82) !important;
    }
    .cards-holder-part .gradient-border-card {
        min-height: 207px !important;
    }
    .cards-holder-part .gradient-border-card p {
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 21px !important;
    }
    .title-blogs {
        padding: 0 0.75rem !important;
    }
    .blogs-img {
        padding: 0 0.75rem !important;
    }
    #jobs {
        margin-top: 12rem !important;
    }

    #jobs .jobs-row {
        padding: 0 2rem !important;
        margin-top: 4.72rem !important;
    }
    .jobs-main-img {
        width: 112.7px !important;
        height: 45px !important;
    }
    .request-service-container {
        width: 84.333% !important;
    }
    .title-blogs {
        font-size: 2rem !important;
    }
    .learn-static-container {
        position: relative;
        top: 56% !important;
    }
    .learn-insider {
        margin: 0 !important;
    }
    .sun-supplier {
        width: 67px !important;
    }
    .learn-main-container {
        padding: 1.25rem 0 !important;
        position: relative !important;
    }
    .img-holder .product-card img {
        width: 100%;
        border-radius: 50px;
        height: 100%;
        min-height: 316px;
    }
    .img-holder .product-card {
        height: 320px !important
        ;
    }
    #services .service-card {
        height: 168px !important;
    }
    .services-btn {
        width: 180px !important;
    }
    #blogs .card {
        margin: 0 0.75rem;
    }
    .learn-more-sec {
        margin-top: 3.7rem !important;
    }
    footer .change-p {
        padding: 0 3rem !important;
    }
    .divider {
        margin-bottom: 2.5rem !important;
    }
    .learn-more-p {
        font-size: 26px !important;
        padding-left: 0 !important;
        padding-right: 5.75rem !important;
        position: absolute !important;
        left: 0 !important;
        top: 26% !important;
    }
    #learn-more .row {
        --bs-gutter-x: 3rem !important;
    }
    .learn-mt {
        margin-top: 1.2rem !important;
    }
    #clients .btn {
        margin-left: -2.5rem !important;
    }
    .services-text {
        font-size: 12px !important;
    }
    .no-width {
        width: auto !important;
        margin-top: 1.1rem !important;
        margin-right: 0.57rem !important;
    }
    .pad-lg-serv {
        padding: 0.35rem 0.5rem !important;
    }
    .navbar .nav-item {
        margin: 0 0.12rem !important;
    }
    .tadawl-container {
        padding-left: 0 !important;
    }
    .footer-main-container {
        top: 3% !important;
    }
    footer .text-primary {
        margin-top: -0.5rem !important;
    }
    #blogs .swiper {
        overflow: unset !important;
    }

    .learn-more-img {
        width: 18.5% !important;
        height: 16.85% !important;
        margin-right: 11.745rem !important;
    }
    #home_achievements {
        padding-top: 173px !important;
        max-width: 921px !important;
    }
    #suppliers {
        max-width: 1060px !important;
    }
    .supplierSwiper {
        padding: 0 1rem !important;
    }
    .stat-item {
        margin-left: 0.7rem !important;
    }
    #blogs .jobs-blogs-btn {
        bottom: 25px !important;
        left: -5px !important;
    }
    #request-service .btn {
        width: initial !important;
    }
    #jobs .jobs-blogs-btn {
        bottom: 20px !important;
        left: 7px !important;
    }
    .contact-p {
        font-size: 31px !important;
        margin-bottom: 1.97rem !important;
    }
    .logo-footer-container {
        left: -25px !important;
    }
    .divider {
        height: 29px !important;
    }
    #products {
        scroll-margin-top: 21px !important;
    }

    .product-btn-container {
        margin-top: 3.375rem !important;
    }
    .divider-bt {
        margin-top: 1.75rem !important;
    }
    .last-footer {
        margin-bottom: 16px !important;
    }
    #home_achievements .statistics {
        padding-top: 2rem !important;
        width: 128.25% !important;
        margin-right: -7.89rem !important;
        margin-top: 0.78rem !important;
    }
    #newsletter input {
        height: 45px !important;
    }
    .sub-img {
        width: 52% !important;
    }
    #home_achievements .icon-heading {
        margin-bottom: 0.45rem !important;
    }

    .res-desc {
        margin-top: 0.27rem !important;
        color: #c8c8c8 !important;
        margin-bottom: 1.35rem !important;
    }

    #contact-us-form {
        padding: 64.5px 0 !important;
    }

    .copyright-container {
        position: absolute;
        bottom: -3.1rem;
        left: 31px;
        width: 100%;
        padding-left: 2rem !important;
        max-width: 1120px !important;
        margin-bottom: 0 !important;
    }
    footer .all-rights {
        padding-right: 0.52rem !important;
    }
    .job-card-title {
        font-size: 20px !important;
    }
    footer .policy-btn {
        margin-left: 3.3rem !important;
    }
    .policy-container .btn {
        font-size: 15px !important;
        line-height: 15px !important;
    }
    #services .moon {
        bottom: 0px !important;
        left: 51px !important;
    }
    #services .moon-low {
        bottom: -17px !important;
        left: 68.75rem !important;
        width: 43px !important;
        height: 43px !important;
    }
    .moon-supplier {
        width: 96px;
        height: 84px;
    }
    .policy-container {
        padding-left: 0.2rem !important;
    }

    .suppliers-title {
        font-size: 27px !important;
    }
    .services-img {
        width: 134px !important;
        height: 48px !important;
    }

    #clients {
        scroll-margin-top: 40px !important;
    }
    .partner-relative-l {
        margin-top: 4rem !important;
    }
    #services .fixed-width {
        width: 355px !important;
    }
    #services .fixed-swipper-wrapper {
        width: 1151px !important;
    }
    #services .swiper {
        overflow: unset !important;
    }

    .our-partner-img {
        margin-bottom: 0.85rem !important;
    }
    #request-service .main-img {
        width: 147.9px !important;
        height: 147.9px !important;
        margin-bottom: 0 !important;
    }
    .contact-card {
        padding: 41px 34px !important;
    }
    .request-service-title {
        font-size: 31px !important;
        line-height: 43.4px !important;
    }
    #services {
        max-width: 1186px !important;
    }
    .card-text {
        -webkit-line-clamp: 1 !important;
    }
    .footer-sub-container {
        position: relative;
        top: -100px;
        padding: 0 1.25rem !important;
    }
    .last-hinter-container {
        padding: 0 !important;
    }
    .title-text-container {
        height: 141px !important;
    }

    .partner-p-l {
        text-align: right !important;
        font-size: 30px !important;
        padding: 0 1rem !important;
        padding-right: 0 !important;
        padding-left: 2rem !important;
    }
    .sub-img {
        margin-bottom: 1.2rem !important;
    }
    .tadawl-container img {
        margin-left: 0.2rem !important;
    }
    .read-more {
        font-size: 13px !important;
        line-height: 19.5px !important;
    }
    .req-text-area {
        min-height: 96px !important;
    }
    #request-service .req-md-custom {
        margin-top: 1.5rem !important;
    }
    #services .service-title {
        margin: 1rem 0 !important;
    }

    #services .sun {
        width: 108px !important;
        top: -12px !important;
        right: 4px !important;
    }

    #scrollToTop {
        left: 53px !important;
    }

    #products .swiper-pagination-bullet {
        width: 8px !important;
        height: 8px !important;
        margin: 0 7.75px !important;
    }

    .top-cont-products {
        margin-top: -9px !important;
    }
    #request-service {
        margin-top: 13.35rem !important;
        margin-bottom: 11.65rem !important;
    }
    .custom-icon {
        background-color: #1f223f !important;
        border-radius: 8px !important;
        opacity: 0.7 !important;
    }
    .clients-main-title {
        margin-left: -47px !important;
    }

    footer .border-secondary {
        border-color: #7a7a7aad !important;
    }
    .footer-last-hinter {
        line-height: 30.4px !important;
    }
    .products-part .breadcrumb {
        margin-top: 4rem !important;
    }
    .products-part .breadcrumb li {
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 14px !important;
    }
    .products-part .title {
        font-size: 28px !important;
        font-weight: 700;
        line-height: 44px !important;
    }
    .products-part .title-container {
        padding-right: 0 !important;
    }
    .products-part .img-container {
        width: 44% !important;
    }
    .img-holder .notShown {
        display: none !important;
    }
    .products-part .img-holder-title {
        font-size: 26px !important;
        font-weight: 600 !important;
        line-height: 26px !important;
    }
    .cust-color {
        color: rgba(247, 248, 251, 0.89) !important;
    }
    .img-holder .col-md-12 {
        max-width: 1328px !important;
        width: 1362px !important;
        margin-right: 0rem !important;
    }
    .img-holder .col-md-12 .card-clients {
        padding: 2.95rem 1rem !important;
    }

    .footer-slogan {
        font-size: 13px !important;
        line-height: 13px !important;
        margin-bottom: 1.25rem !important;
        font-weight: 900 !important;
    }
    .policy-container {
        font-size: 15px !important;
        line-height: 15px !important;
    }

    #mayors {
        max-width: 1140px !important;
        margin-top: 8.75rem !important;
        scroll-margin-top: 52px;
        transition: all 2s ease-in-out !important;
    }
    #mayors .more-about {
        padding: 0 3.93rem !important;
    }
    #partners2 .custom-row {
        --bs-gutter-x: 2.85rem !important;
    }
    .mayor-img {
        margin-bottom: 0.5rem !important;
    }
    #jobs .job-card {
        height: 250px !important;
    }
    /* company video page */
    .container.company-video-container {
    }
    .video-title {
        font-size: 27px;
        font-weight: 300;
        line-height: 27px;
        margin: 0.35rem auto;
    }

    .company-video-container .video {
        opacity: 1;
        max-height: 463px;
        object-fit: cover;
        margin-top: 2.2rem;
        border-color: #fff !important;
        border-radius: 15px !important;
        border-width: 2.6px !important;
    }
    /* parts */
    .about-top-container {
        margin: 2rem auto !important;
    }
    .container.mt-4 .breadcrumb-item {
        font-size: 14px !important;
        font-weight: 500 !important;
        line-height: 14px !important;
    }
    .container.mt-4 .bread.mt-3 {
        margin-right: 1rem !important;
    }
    .first-about-container {
        margin-top: 4rem !important;
        max-width: 1170px !important;
    }
    .about-text-container {
        padding-left: 3rem !important;
    }
    .about-position-relative {
        position: relative !important;
    }
    .about-position-relative .about-moon {
        bottom: -49px;
        right: unset !important;
        left: -51px;
        max-width: 66px !important;
    }
    .services_modal {
        top: 36% !important;
    }
    .services_modal .modal-title {
        font-size: 20px !important;
        font-weight: 500 !important;
        line-height: 30px !important;
        margin: auto 1rem !important;
    }
    .services_modal .btn-close {
        top: unset !important;
    }
    .container.request-serv-p {
        max-width: 1164px !important;
    }
    .request-serv-p .form-container {
        padding: 1rem 1.37rem !important;
    }
    .request-serv-p .form-container .row {
        margin-bottom: 0.1rem !important;
        --bs-gutter-x: 0.65rem !important;
    }
    .request-serv-p .form-container .btn {
        border-color: white !important;
        padding: 0.75rem 4.4rem !important;
        background-color: rgb(238, 153, 25) !important;
        font-size: 15px !important;
        line-height: 15px !important;
    }
    .request-serv-p .form-container .form-control {
        padding: 0.4rem 0.85rem !important;
        border: 1px solid rgb(105, 114, 125) !important;
    }
    .request-serv-p .form-container textarea.form-control {
        padding: 0.7rem 0.75rem !important;
        min-height: auto !important;
    }
    .request-serv-p .breadcrumb {
        margin-top: 2.35rem !important;
        padding-right: 1.3rem !important;
    }
    .clientsD .breadcrumb {
        margin-top: 1.45rem !important;
        padding-right: 2.3rem !important;
        color: white !important;
        position: relative !important;
        top: -14px !important;
    }
    .clientsD .pos-rel {
        position: relative !important;
    }
    .clientsD .title-cont {
        margin: 4.4rem auto !important;
    }
    .clientsD .partners-container {
        margin: 4.4rem auto !important;
    }
    .clientsD .learn-more-img {
        top: 35px !important;
        position: absolute;
        left: 264px;
        width: 16% !important;
        height: 11.85% !important;
    }
    .title-cont .pos-rel h4 {
        margin-right: 0.5rem !important;
    }
    .contact-us-part label {
        font-weight: 700 !important;
    }
    .contact-us-part form div:not(:last-of-type) {
        margin-bottom: 0.2rem !important;
    }
    .job-part .breadcrumb {
        margin-top: 3.5rem !important;
    }
    .job-part .fl-job p {
        width: 124% !important;
    }
    .news-part .title-container {
        padding: 0 !important;
        position: relative !important;
    }
    .news-part .yellow-don {
        position: absolute;
        top: -8px;
        left: 86px;
        max-width: 75px;
    }
    .news-part .card-clients {
        width: 119%;
        margin-right: -6rem !important;
        padding: 3rem !important;
        margin-top: -4rem;
    }
    .news-part .card-clients p {
        font-size: 25px !important;
        font-weight: 700 !important;
        line-height: 32.5px !important;
    }
    .services-part .breadcrumb {
        margin-top: 3.5rem !important;
    }
    .services-part .title {
        font-size: 28px !important;
        font-weight: 700 !important;
        line-height: 41px !important;
        margin-bottom: 0.85rem !important;
        width: 112% !important;
    }
    .services-part .main-img {
        width: 122%;
        margin-top: -5rem;
        margin-right: -4rem;
    }
    .services-part .big-cont {
        margin-top: 2rem;
    }
    .card-cont .card-clients {
        width: 119%;
        margin-right: -6rem !important;
        padding: 3rem !important;
        margin-top: -4rem;
    }
    .card-cont .pos-rel .sun {
        position: absolute !important;
        max-width: 95px;
        top: -37px;
        right: 6rem !important;
    }

    .card-cont .pos-rel .moon {
        position: absolute !important;
        left: 43px;
        top: 5rem;
    }
    .pos-rel {
        position: relative !important;
    }
    .card-cont .yellow-don {
        position: absolute;
        max-width: 100px;
        top: 48rem;
        left: -51px;
    }
    .main-services-swiper {
        margin-bottom: 10rem !important;
    }
    .card-cont .moon-bottom {
        position: absolute;
        max-width: 100px;
        top: 49rem;
        right: -51px;
    }
    .clientsD .high-width-c .col-md-10 {
        width: 100.333% !important;
    }

    .news-part .breadcrumb {
        margin-top: 4rem !important;
    }
    .services-part .btn {
        padding: 0.75rem 4rem !important;
    }
    .contact-us-part .form-container {
        padding: 2rem 1rem !important;
    }
    .contact-us-part .contact-desc {
        color: rgba(255, 255, 255, 0.92) !important;

        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        padding-left: 4.1rem !important;
        margin-top: 1rem !important;
    }
    .job-part .fl-job {
        justify-content: space-between !important;
    }

    .clientsD .blue-clients {
        top: -31px !important;
        position: absolute;
        right: 0;
        left: unset !important;
        width: 9% !important;
        height: 69.85% !important;
    }
    .clientsD .title-container {
        padding: 0 0.5rem !important;
    }
    .clientsD .yellow-clients {
        top: -4px !important;
        position: absolute !important;
        left: 0;
        right: unset !important;

        max-width: 99px;
    }
    .clientsD .partners-container img {
        width: 20% !important;
    }
    .clientsD .breadcrumb-item {
        color: white !important;
    }
    .clientsD .pos-rel {
        position: relative !important;
        margin-bottom: 3.2rem !important;
    }
    .clientsD .pos-rel .clients-title {
        margin-bottom: 1.22rem !important;
    }
    .clientsD .clients-desc {
        font-size: 22px !important;
        font-weight: 400 !important;
        line-height: 33px !important;
        margin-bottom: 16px !important;
        color: rgb(89, 95, 111) !important;
    }
    .clientsD .sun {
        position: absolute;
        left: -56px;
        top: -50px;
        right: unset !important;
    }
    .clientsD .title-cont .title-desc {
        font-size: 31px !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: 46.5px !important;
        padding: 0 4rem !important;
        padding-right: 3rem !important;
    }
    .request-serv-p {
        max-width: 1163px !important;
    }
    .request-serv-p .breadcrumb li {
        font-size: 15px;
        font-weight: 500;
        line-height: 15px;
    }
    .request-serv-p .breadcrumb-item::before {
        margin: 0 7px;
    }
    .request-serv-p .breadcrumb-item:not(:first-child)::before {
        margin: 0 5px;
    }
    .request-serv-p .text-cont {
        margin-top: 0.4rem !important;
        position: relative !important;
    }
    .request-serv-p .moon {
        max-width: 99px !important;
        bottom: -5px !important;
        right: unset !important;
        left: 84px !important;
    }
    .request-serv-p .req-desc {
        font-size: 18px !important;
        font-weight: 400 !important;
        line-height: 27px !important;
        margin-bottom: 16px !important;
        margin-top: 0px !important;
        color: rgb(167, 167, 167) !important;
    }
    .request-serv-p .row.mb-3 > .col-md-6.mb-3.mb-md-0 {
        margin-bottom: 0.55rem !important;
    }
    .request-serv-p .row.mb-3 > .col-md-6.mb-3.mb-md-0:last-of-type {
        width: 100% !important;
    }
    .request-serv-p .row.mb-3 > .col-md-6.mb-3.mb-md-0:last-of-type input {
        padding: 2rem 0.25rem !important;
    }
    .request-serv-p .submit-btn {
        padding: 0.35rem 3.75rem;
    }
}
.jobs-p {
    margin-bottom: -1.45rem !important;
}
.solution-icon {
    margin-bottom: 1.49rem !important;
}
.mayors-p {
    margin-bottom: 1.62rem !important;
}
.profile-mayor-btn {
    border-radius: 18px !important;
    font-size: 18px !important;
    margin-right: -8px !important;
}
#clients {
    max-width: 1140px !important;
    margin-top: -2.25rem !important;
    margin-bottom: 6.85rem !important;
}
#clients .slider-wrapper {
    padding: 0;
}

.products-wrapper {
    margin-top: 0.612rem !important;
}

#feedbacks .swiper-pagination-bullet {
    background: #ffffff4d !important;
    width: 12px;
    height: 12px;
    margin-top: 2rem !important;
}
#feedbacks .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--bs-primary) !important;
}

.footer-main-container {
    position: relative !important;
}

.relative-blog {
    position: relative !important;
}

.sun-supplier-blog {
    top: -159px !important;
    left: 406px !important;
    width: 72px !important;
    height: 72px !important;
}

#blogs {
    scroll-margin-top: 40px;
}

#blogs .swiper-slide {
    cursor: pointer !important;
}

.sun-jobs-img {
    top: -116px;
    left: 67px;
    width: 64px;
}

.btn-lng-container {
    margin-top: 0.25rem !important;
    margin-left: 1.1rem !important;
}
.elementor-background-overlay {
    background-image: url("../images/heading-bg.png");
}
.nav-btn {
    margin-right: 1.85rem !important;
}
.cert-img {
    margin-left: 0.05rem !important;
}
.last-cert-img {
    margin-left: 0.3rem !important;
}

#blogs .card-body {
    padding: 2rem !important;
}
#jobs .jobs-row {
    padding: 0 2rem;
    margin-top: 6rem;
}
.job-info .btn {
    position: absolute;
    top: 23px !important;
    right: -3px !important;
    padding: 0.5rem 1.75rem !important;
    font-size: 13px;
}

.jobs-card-desc {
    font-size: 14px !important;
    line-height: 26px !important;
}

.jobs-blogs-btn {
    font-size: 18px !important;
    line-height: 1 !important;
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}
.job-info {
    position: relative !important;
}
.jobs-blogs-btn i {
    margin: 0 6px !important;
}
.job-card {
    padding: 1.15rem !important;
}
#request-service.container {
    max-width: 1339px !important;
}

#request-service .form-control {
    border: 1px solid #69727d !important;
    color: white !important;
}

#request-service .btn:hover {
    border-color: white !important;
    background-color: #d98908 !important;
}

#contact-us-form .btn {
    background-color: #ee9919 !important;
    display: inline-block !important;
    line-height: 1 !important;
    font-size: 15px !important;
    padding: 12px 24px !important;
    border-radius: 3px !important;
    color: #fff !important;
    fill: #fff !important;
    text-align: center !important;
    transition: all 0.3s !important;
}

footer li {
    font-size: 14px !important;
    font-weight: 400 !important;
}

footer button {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}
footer button i {
    margin: 0 0.2rem !important;
}

.news-img {
    height: 256px !important;
}

.f-img {
    margin-bottom: 0.85rem !important;
}

#products .swiper-wrapper {
    margin-bottom: 1rem !important;
}
#feedbacks .swiper-wrapper {
    margin-bottom: 2rem !important;
}

/* .learn-more-p {
    font-size: 26px !important;
    padding-left: 0 !important;
    padding-right: 5rem !important;
} */
#learn-more .stat-text {
    font-size: 26px !important;
}

#services h4 {
    font-weight: initial !important;
}

#contact-us-form .container {
    max-width: 686px !important;
}

#contact-us-form p {
    font-size: 31px;
    font-weight: 400 !important;
}

.our-partner-img {
    width: 119px;
    height: 45px;
}

.starts-partner-img {
    position: absolute;
    margin-bottom: 22rem;
    top: -190px;
    right: 88px;
}
.starts-footer-img {
    position: absolute;
    margin-bottom: 22rem;
    top: -252px;
    right: 69px;
}

.partner-relative-l {
    position: relative !important;
}

.services-btn {
    margin: auto !important;
    padding: 0.8rem 1.1rem !important;
    margin-bottom: 1rem !important;
    font-size: 18px !important;
}
.services-btn i {
    margin: 0 6px !important;
}

.moon-low {
    width: 40px !important;
    height: 40px !important;
}
.moon-supplier {
    top: -20px;
    right: 84px;
}
.sun-supplier {
    bottom: -17px;
    left: 27px;
    height: 67px;
}

.suppliers-title {
    font-weight: 700 !important;
}

.container {
    max-width: 1140px !important;
}

#services {
    max-width: 1140px;
}

.products-btn {
    margin: auto !important;
    /* padding-top: 0.75rem !important;
        padding-bottom: 0.75rem !important; */
    padding-top: 1.2rem !important;
    padding-bottom: 1.2rem !important;
}
.products-btn i {
    margin: 0 6px !important;
}
#feedbacks.container {
    max-width: 1140px !important;
}
.mayors-video-container {
    margin-top: 3.5rem !important;
    overflow: hidden !important;
}
.clients-main-title {
    font-size: 1.25rem !important;
    line-height: 1 !important;
}
.divider {
    opacity: 0.6 !important;
}
.products-title-img {
    width: 134px !important;
    height: 48px !important;
}
.product-title {
    font-size: 23px;
}
.stat-icon img {
    width: 65px;
}
.stat-icon {
    margin-bottom: 0.75rem !important;
}
.statistics-text {
    margin-bottom: 0.6rem !important;
    font-size: 26px !important;
}
.home-title-container {
    width: 100%;
}
.mayors-p {
    width: 85%;
}
.brand-img {
    width: 86.7px;
    height: 37.1667px;
}

/* LARGE SCREEN */

@media (min-width: 480px) {
    .testimonialsSwiper {
        padding-left: 1.2rem;
        padding-right: 1.2rem;
    }
}
@media (max-width: 479px) {
    .testimonialsSwiper {
        padding-left: 0.35rem;
        padding-right: 0.35rem;
    }
}
@media (max-width: 440px) {
    .swiper-pagination-bullet {
        margin: 0 6px !important;
        width: 3px;
        height: 9px;
    }
}

@media (max-width: 433px) {
    .watch-more-client-btn {
        max-width: 94%;
        margin: auto;
    }
}

/* @media (max-width: 474px) {
    .testimonials-img {
        width: 90%;
        height: 100%;
    }
} */
@media (min-width: 475px) {
    .testimonials-img {
        width: 100%;
        max-width: 100%;
        height: 100%;
        object-fit: contain;
    }
}

/* media screen two layout*/

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: bold;
}
:root {
    --bs-primary: #d98908;
}
#scrollToTop {
    position: fixed;
    bottom: 25px;
    left: 12px;
    z-index: 1000;
    font-size: 1.5rem;
}
.text-primary {
    color: var(--bs-primary) !important;
}
.bg-primary {
    background-color: var(--bs-primary) !important;
}
.active {
    color: var(--bs-primary);
}
.text-muted {
    color: rgba(255, 255, 255, 0.7) !important;
}
.small {
    font-size: 0.7rem;
}
.w-85 {
    width: 85% !important;
}
.radius-2 {
    border-radius: 10px;
}
.radius-3 {
    border-radius: 20px;
}
.animate__animated {
    /* will be changed to 1 when the animation is done */
    opacity: 0;
}
.btn-border {
    border: 2px solid var(--bs-primary);
}
.btn-border:hover {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary) !important;
}
.btn-opacity {
    background-color: rgba(255, 255, 255, 0.1);
}
.bg-dark-opacity {
    background-color: rgba(0, 0, 0, 0.2);
}
.btn-hover {
    color: white;
}
.btn-hover:hover {
    color: var(--bs-primary) !important;
}
.breadcrumb-item::before {
    --bs-breadcrumb-divider: "\f061";
    font-weight: 600;
    font-family: "Font Awesome 5 Free";
}
.breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.9);
}
.breadcrumb-item:not(.active) > a {
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
}
.breadcrumb-item:not(.active) > a:hover {
    color: rgba(255, 255, 255, 0.9);
}
.breadcrumb-item.active > a {
    color: rgba(255, 255, 255, 0.9);
    text-decoration: none;
}
.breadcrumb-item.active > a:hover {
    color: #fff;
}
.gradient-border-btn {
    position: relative;
    border: none;
    color: #fff;
}

.gradient-border-btn:hover {
    color: #fff;
    background-color: var(--bs-primary);
}

.gradient-border-btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: inherit;
    padding: 1.25px !important; /* This determines border thickness */
    background: linear-gradient(
        to right,
        #1c4b8c,
        #f59d1a
    ); /* Change colors as needed */
    -webkit-mask: linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 1;
    transition: opacity 0.3s ease;
}

.btn-full-width {
    width: 100%;
}

@media (min-width: 768px) {
    .btn-full-width {
        width: auto;
    }
}

.mb-8 {
    margin-bottom: 8rem;
}

.wide-btn {
    padding-top: 12px;
    padding-bottom: 12px;
    width: 260px;
}

/* margins */

@media (min-width: 768px) {
    /* Adjust the breakpoint if needed */
    #mayors,
    #clients,
    #suppliers {
        margin-top: 3rem;
        margin-bottom: 10rem;
    }
    #learn-more {
        margin-top: 6rem;
        margin-bottom: 6.25rem;
    }
    #suppliers {
        margin-top: 5.75rem;
        margin-bottom: 11.5rem;
    }
    #partners2 {
        margin-bottom: 17.25rem;
        margin-top: 12.75rem;
    }
    #jobs {
        margin-top: 10rem;
        margin-bottom: 10rem;
    }
    #request-service {
        margin-top: 11rem;
        margin-bottom: 9rem;
    }
}

/* navbar */

.navbar {
    background-color: #010324;
    padding: 1.8rem 1rem;
}

@media (min-width: 992px) {
    .navbar {
        background-color: transparent;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }
}

@media (min-width: 992px) {
    .navbar-nav > li:first-child a {
        margin-right: 65px !important;
    }
    .home-active {
        background-color: #ee9919 !important;
        margin-right: 65px !important;
    }

    .navbar-nav > li:first-child a,
    .navbar-nav > li:first-child span {
        color: white !important;
    }
    .navbar::after {
        content: "";
        position: fixed;
        top: 100px; /* Adjust to the height of your navbar */
        left: 0;
        right: 0;
        height: 0.75px;
        background: #c0c0c03d;
        z-index: 1000;
    }
}

.navbar-brand {
    font-size: 2rem;
    font-weight: bold;
}
.navbar .nav-link {
    color: white !important;
    font-size: 1rem;
    border-radius: 30px;
    padding: 12px !important;
}
.navbar .nav-link.active {
    background-color: var(--bs-primary);
    border-radius: 30px;
    padding: 12px;
}
.navbar .nav-link:hover:not(.active) {
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 30px;
}
.breaker {
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
.btn-service {
    background-color: #010324;
    color: white;
    border-radius: 8px;
    border-width: 10px !important;
    padding: 0.5rem 1.75rem;
    transition: all 0.3s ease;
}
@media (max-width: 991.98px) {
    .btn-service {
        background-color: var(--bs-primary);
        margin-top: 2rem;
    }
    .btn-service.gradient-border-btn::before {
        display: none;
    }
    .breaker-sm {
        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
        padding: 0.525rem 0;
    }
}
.btn-service:hover {
    background-color: var(--bs-primary);
    color: white;
}

/* footer */

.social-icons {
    display: flex;
    gap: 5px;
}
.icon {
    width: 35px;
    height: 35px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    transition: transform 0.2s ease-in-out;
    text-decoration: none;
    color: white;
    font-size: 18px;
}
.icon-heading {
    width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: transform 0.2s ease-in-out;
    text-decoration: none;
    color: white;
    font-size: 23px;
}
.icon-heading:hover {
    transform: scale(1.1);
    color: var(--bs-primary);
}
.icon:hover {
    transform: scale(1.1);
    color: var(--bs-primary);
}
.icon:hover {
    transform: scale(1.1);
    color: var(--bs-primary);
}
footer .nav-link:hover {
    color: var(--bs-primary) !important;
}
#newsletter input {
    background: #2c2e42;
    /* opacity: 0.5; */
    color: white;
    padding: 10px 15px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: 5px !important;
    border-bottom-left-radius: 5px !important;
}
#newsletter button {
    border: 1px solid var(--bs-primary);
}
#newsletter input::placeholder {
    color: rgba(255, 255, 255, 0.5);
}
#newsletter input:focus {
    /* background: rgba(255, 255, 255, 0.15) !important; */
    box-shadow: none;
    border: 1px solid #ced4da !important;
    border-left: 0 !important ;
    color: white !important;
}
.btn-yellow {
    background-color: #ff9934;
    color: white;
    border: none;
    padding: 10px 20px;
    border-top-right-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
}
#newsletter .btn:hover {
    background-color: #ff8814;
    color: white;
}

/* home_achievements section */

#home_achievements {
    background-image: url("../images/heading-bg.png");
    background-position: top center;
    background-repeat: no-repeat;
    background-size: contain;
    padding-top: 150px;
    max-width: 1000px;
}

/* certificates */

.cert-img {
    max-height: 62px;
    height: 100%;
}
@media (max-width: 768px) {
    .cert-img {
        max-width: 34px;
        margin-top: 0.5rem;
    }
}
/* @media (max-width: 576px) {
    .cert-img {

        margin-left: .01rem !important;
    }
} */

/* achievements */

.stat-item {
    position: relative;
    flex: 0 0 auto;
    padding: 1rem;
    min-width: 150px;
}
.stat-item::after {
    content: "";
    position: absolute;
    right: 0;
    top: 49%;
    transform: translateY(-50%);
    height: 71px;
    width: 2px;
    background-color: rgba(255, 255, 255, 0.2);
}
.stat-item:last-child::after {
    display: none;
}
@media (max-width: 767.98px) {
    .stat-item:nth-child(2n)::after {
        content: none;
    }
}
/* @media (max-width: 575.98px) {
    .stat-item:nth-child(1n)::after {
        content: none;
    }
}
@media (min-width: 576px) and (max-width: 767.98px) {
    .stat-item:nth-child(2n)::after {
        content: none;
    }
}
@media (min-width: 768px) and (max-width: 991.98px) {
    .stat-item:nth-child(3n)::after {
        content: none;
    }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    .stat-item:nth-child(4n)::after {
        content: none;
    }
}
*/

/* about company */

.video {
    border-radius: 20px;
    /* height: fit-content; */
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
    border-radius: 20px;
    object-fit: cover;
    display: block;
}

/* products */

.solution-icon {
    width: 80px;
}

.swiper-pagination {
    bottom: 25 !important;
}
.swiper-pagination-bullet {
    background: #d5dae1 !important;
    opacity: 1 !important;
}
.swiper-pagination-bullet-active {
    background: var(--bs-primary) !important;
}

.swiper-pagination-bullet {
    margin: 0 6px;
}

.divider {
    background-image: url("../images/divider.png");
    background-size: contain;
    height: 20px;
    margin: 3rem 0;
}

#products {
    background-color: #1a1d45;
}

/* learn more */

#learn-more {
    padding: 5rem 0;
    background-image: url("../images/waves-bg.png");
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
}

.underline {
    margin-left: 24rem;
    margin-top: 0.6rem;
}

@media (max-width: 768px) {
    .underline {
        display: none;
    }
}

/* services */

.service-card {
    border-radius: 12px;
    padding: 30px 20px;
    transition: transform 0.3s ease;
    text-align: start;
    background-image: url("../images/service-card-border.png");
    background-size: cover;
    border: 0.3px solid #444444;
    height: 286px;
}
.service-title {
    font-size: 1rem;
    margin: 2rem 0;
}
.w-md-75 {
    width: 100% !important;
}
@media (min-width: 768px) {
    .w-md-75 {
        width: 75% !important;
    }
}

.service-card-height {
    height: 100%;
}
@media (max-width: 768px) {
    .service-card-height {
        height: 312px;
    }
}
.service-card:hover {
    transform: translateY(-5px);
}
.custom-swiper-prev,
.custom-swiper-next {
    z-index: 1000;
    width: 32px;
    height: 32px;
    padding: 12px;
    font-size: 14px;
    border-radius: 50px;
    color: #fff;
    background: #112037;
    transition: all 0.3s ease-in-out;
    border: none;
    padding: 0 !important;
}

.truncate-lines {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    font-size: 16px;
}

.truncate-lines-2 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-clamp: 3;
    -webkit-line-clamp: 2;
}

.truncate-lines-3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-clamp: 3;
    -webkit-line-clamp: 3;
}

.truncate-lines-4 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-clamp: 4;
    -webkit-line-clamp: 4;
}

.border-opacity {
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

.fs-8 {
    font-size: 0.8rem;
}

#services {
    padding: 2rem;
}

.decorative-image {
    z-index: 21;
    max-width: 150px;
    height: auto;
}

.yellow-donut {
    bottom: -6.5rem;
    z-index: 1;
}

@media (max-width: 768px) {
    .yellow-donut {
        display: none;
    }
}

/* our partners */

.partners2Swiper {
    width: 100%;
    height: 400px; /* Full-screen height */
}

.client_swiper {
    width: 100%;
}

@media (max-width: 767px) {
    .client_swiper {
        height: 323px; /* vertical mode for small screens */
    }
}

@media (min-width: 768px) {
    .client_swiper {
        height: auto; /* allow content to define height in horizontal grid mode */
    }
}

.partners-card {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border-radius: 12px;
    padding: 15px 35px;
    text-align: center;
    border: 0.3px solid #444444;
}

/* testimonials */

.testimonials-img {
    opacity: 0.9;
    min-height: 362px;
    object-fit: cover;
    height: 362px;
}
.testimonials-img:hover {
    opacity: 1;
}

/* news */

.news-card {
    border-radius: 22px;
    border: 1px solid gray;
}
.news-img {
    border-radius: 20px 20px 0 0;
    height: 300px;
    width: 100%;
    object-fit: cover;
}

.page-item.disabled .page-link {
    background-color: inherit;
    border-color: inherit;
}

.gradient-border-card {
    position: relative;
    box-sizing: border-box;
}

.gradient-border-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: inherit;
    padding: 4px; /* This determines border thickness */
    background: linear-gradient(
        to right,
        #1c4b8c,
        #f59d1a
    ); /* Change colors as needed */
    -webkit-mask: linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: -1;
}

.gradient-border-card:hover::before {
    opacity: 1;
}

/* jobs */

.job-card {
    border-radius: 10px;
    background-color: #1f213e;
    border: solid 1px rgba(255, 255, 255, 0.84);
}

/* contact form */

.contact-card {
    border-radius: 20px;
    padding: 35px 25px;
    transition: transform 0.3s ease;
    text-align: start;
    background-image: url("../images/contactus-bg.png");
    background-size: cover;
    background-position: center center;
    border: 3px solid #848484;
}

.contact-card .form-control {
    background-color: transparent;
    color: #fff;
}
.contact-card .form-control::placeholder {
    color: rgba(255, 255, 255, 0.7);
}
@media (max-width: 450px) {
    html[lang="en"] #newsletter .subscribe-input {
        height: 46px !important;
        min-width: 217px !important;
        text-align: left !important;
    }
}

/* contact card */

#contact-us-form {
    padding: 75px 0;
    background-image: url("../images/contact-card-bg.png");
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* ////////////////////////// */
/* clients page */

.intro {
    margin: 6rem auto;
}

.clientsD-card {
    border-radius: 20px;
    padding: 15px;
    transition: transform 0.3s ease;
    border: 0.3px solid #7a7a7a;
    background-color: #17193d;
}
.big-margin {
    margin: 6rem auto;
}
.big-margin-bottom {
    margin-bottom: 6rem;
}

@media (max-width: 768px) {
    .big-margin {
        margin: 3rem auto;
    }
}

.card-clients {
    background-image: url("../images/req-serv-bg.png");
    background-position: center center;
    background-size: cover;
    border-radius: 25px;
    padding: 2rem 2rem;
    text-align: center;
    color: white;
}
.logo-clients {
    width: 100px;
    margin-bottom: 2rem;
}
.service-btn {
    background-color: rgba(255, 255, 255, 0.1);
    border: none;
    padding: 0.8rem 2rem;
    color: white;
    border-radius: 8px;
    transition: background-color 0.3s;
}
.service-btn:hover {
    background-color: rgba(255, 255, 255, 0.2);
    color: white;
}
.card-heading {
    font-size: 2rem;
    margin-bottom: 0.5rem;
}

/* about us pager */
.values-card {
    background-color: #0f1231;
    border-radius: 12px;
    padding: 15px;
    transition: transform 0.3s ease;
}
.bg-dark-opacity {
    background-color: rgba(0, 0, 0, 0.2);
}
.values-card:hover {
    transform: translateY(-5px);
}
.heading-with-line-above {
    position: relative;
}

.heading-with-line-above::before {
    content: "";
    position: absolute;
    top: -3rem;
    left: 50%;
    transform: translateX(-50%);
    width: 5%;
    height: 3px;
    background-color: white;
}

.timeline p {
    font-size: 0.8rem;
}

@media (min-width: 992px) {
    .timeline {
        background-image: url("../images/timeline-bg.png");
        background-size: cover;
        background-position: center center;
        padding: 3rem 0;
    }
    .timeline-item {
        width: 20%;
    }
}

.ceo-container {
    background-color: #1a1d45;
}

/* products page */

.product-card img {
    width: 100%;
    border-radius: 50px;
}

.product-card .overlay {
    position: absolute;
    top: 0;
    left: 12px;
    right: 12px;
    bottom: 0;
    /* background-color: rgba(0, 0, 0, 0.5); */
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.287) 0%,
        rgba(0, 0, 0, 0.444342) 26.13%,
        rgba(0, 0, 0, 0.6068) 69.56%,
        rgba(0, 0, 0, 0.82) 100%
    );
    opacity: 0;
    transition: opacity 0.3s ease;
    border-radius: 50px;
}
.product-card:hover .overlay {
    opacity: 1;
}

.page-item .page-link {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.3);
    color: #fff;
}
.page-item .page-link:hover {
    background-color: var(--bs-primary);
}
.page-item.active .page-link {
    background-color: var(--bs-primary);
    border-color: rgba(255, 255, 255, 0.3);
    color: #fff;
}

/* services page */

/* new */
/* Hide large screen section on small screens */
.large-screen-only {
    display: block;
}

.small-screen-only {
    display: none;
}

/* Media query for small screens */
@media (max-width: 767px) {
    .large-screen-only {
        display: none;
    }
    .small-screen-only {
        display: block;
    }
}

/* Media query for large screens */
@media (min-width: 768px) {
    .large-screen-only {
        display: block;
    }
    .small-screen-only {
        display: none;
    }
}

/* new */

/* .main-services-swiper {
    height: 265px;
}

@media (min-width: 768px) {
    .main-services-swiper {
        height: 530px !important;
    }
}

@media (min-width: 1200px) {
    .main-services-swiper {
        height: 800px !important;
    }
} */

.services-text {
    font-size: 16px;
    margin: 2.5rem auto;
}

.modal-content {
    border-top: 13px solid;
    border-image: linear-gradient(
            to left,
            #f59d1a 0%,
            #1c4b8c 100%,
            #f59d1a 100%
        )
        1;
}
.modal-header .modal-img {
    background-color: #010324;
    padding: 6px 14px;
}
.bg-qtech {
    background-color: #1a1d45;
}
.bg-qtech input {
    background: #2c2e42 !important;
}
.bg-qtech hr {
    position: absolute;
    left: 0;
    top: 48px;
    width: 100%;
}

.about-qtech {
    background: url(../images/about-qtech.png) no-repeat;
    background-size: cover;
    border: 1px solid #1a1d45;
    border-radius: 10px;
}
.about-qtech button {
    font-size: 13px;
}

/* service request */

.request-service {
    height: 169px;
    background-image: url(../images/req-service-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
}
.form-container {
    background-color: rgba(13, 13, 48, 0.9);
    border-radius: 15px;
    padding: 2rem;
    max-width: 1200px;
    margin: 0 auto;
}
.form-container .form-control {
    background-color: rgba(13, 13, 48, 0.9);
    border: 1px solid #8b8b8b;
    color: #ffffff;
    padding: 0.75rem;
}
.form-container .form-control:focus {
    background-color: rgba(13, 13, 48, 0.9);
    border-color: #3a3a7a;
    color: #ffffff;
    box-shadow: 0 0 0 0.25rem rgba(58, 58, 122, 0.25);
}
.submit-btn {
    background-color: var(--bs-primary);
    color: #fff;
    border: 1px solid transparent;
    padding: 0.75rem 2rem;
    font-size: 1.1rem;
}
@media (max-width: 767.98px) {
    .submit-btn {
        width: 100%;
    }
}
.submit-btn:hover {
    color: #fff;
    border: 1px solid #fff;
}
textarea.form-control {
    min-height: 120px;
}

/* jobs */
body {
    background-color: #0a0a2e;
    color: #ffffff;
    padding: 2rem;
}
.title-decoration {
    width: 50px;
    height: 3px;
    background-color: #f9a825;
    margin-bottom: 1rem;
}
.title {
    font-size: 2rem;
    font-weight: 600;
    margin: 0;
}
.btn-country {
    padding: 0.5rem 1.5rem;
    border-radius: 25px;
    font-weight: 500;
    transition: all 0.3s ease;
    background-color: transparent;
    border: 1px solid #ffffff;
    color: #ffffff;
}
.btn-country:hover {
    background-color: rgba(255, 255, 255, 0.1);
    color: #ffffff;
}
.btn-active {
    background-color: var(--bs-primary);
    border: none;
    color: #ffffff;
}
.btn-active:hover {
    color: #ffffff;
    background-color: var(--bs-primary);
}