@import url("https://fonts.googleapis.com/css2?family=Tajawal:wght@200;300;400;500;700;800;900&display=swap");

body {
    background-color: #fff;
    scroll-behavior: smooth;
    direction:;
}

.breadcrumb {
    margin: 0 !important;
}

:root {
    --primary-color: #796f57; /* light brown */
    --secondary-color: #6d6249; /* brown */
}

body.normal {
    word-spacing: 0 !important;
    line-height: inherit !important;
    font-size: inherit !important;
}

* {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    font-family: "Tajawal", sans-serif;
}

/* width */
::-webkit-scrollbar:not(.select2-results__options) {
    width: 5px;
    border-radius: 50px;
    height: 5px;
}

/* Track */
::-webkit-scrollbar-track:not(.select2-results__options) {
    background: var(--primary-color);
    opacity: 0.5;
    border-radius: 50px;
}

/* Handle */
::-webkit-scrollbar-thumb:not(.select2-results__options) {
    background: var(--primary-color);
    border-radius: 50px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover:not(.select2-results__options) {
    background: var(--primary-color);
    border-radius: 50px;
}

.select2-results__option--highlighted[aria-selected] {
    background-color: var(--primary-color) !important;
    color: white; /* Change text color as needed */
}

.select2 {
    width: inherit;
    height: 44px;
    border-radius: 8px;
    border: 1px solid #e8eef7;
    direction: ltr;
}

.select2-container--default
.select2-selection--single
.select2-selection__arrow {
    height: 26px;
    position: absolute;
    top: 1px;
    right: 1px;
    left: inherit;
    width: 20px;
    top: 50%;
    transform: translateY(-50%);
}

.select2-container .select2-selection--single {
    width: inherit;
    height: 44px;
    border-radius: 8px;
    border: 1px solid #e8eef7;
    direction: ltr;
    display: flex;
    flex-direction: row;
    align-items: center;
    min-width: 119px;
}

a {
    text-decoration: none !important;
    cursor: pointer;
}

ul {
    list-style: none !important;
    padding: 0 !important;
}

.hide {
    display: none !important;
}

input.dark::placeholder {
    color: #fff;
}

input.light::placeholder {
    color: #26293e;
}

.container .row {
    flex-direction: row-reverse;
}

.clients .container .row {
    flex-direction: row;
}

.clients-f .container .row {
    flex-direction: row;
}
/* Modefied by Yosef on 5-1-2025 */
.publications-page .header .search {
    display: flex;
    flex-direction: row-reverse;
    margin-bottom: 40px;
    background-color: #ffffff !important;
    border: 2px solid #e8eef7;
    border-radius: 8px;
}

/* Modefied by Yosef on 27-4-2025 */
/*.slick-track {
    width: max-content !important;
}*/
/* Modefied by Yosef on 28-4-2025 */
/*.slick-slider {
direction:rtl
}*/
/*.slick-slide {
    float: right !important;
}*/
/* Modefied by Yosef on 27-4-2025 */
/*.slick-slide img {
    width: 130px;
    height: 100px;
    float: right !important;
}*/
/*.landing .screens .screen .our-services .landing-services .services-slider .slide .service {
    height: 100px !important;
}*/
.landing .screens .screen .our-services .landing-services .services-slider .slide .service img {
    height: 93px !important;
    margin: auto !important;
}

.slide.slick-slide > div {
    box-shadow: none;
    scale: 1;
    transition: 0.4s;
}

    .slide.slick-slide > div:hover {
        box-shadow: 0 0 4px 2px rgba(0, 0, 0, 0.2);
        scale: 1.04;
        z-index: 1;
    }

.row .col-12 > div {
    box-shadow: none;
    scale: 1;
    transition: background-color 0.3s ease;
}

    .row .col-12 > div:hover {
        box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1);
        scale: 1.08;
        z-index: 1;
    }

button {
    box-shadow: none;
    scale: 1;
    transition: 0.4s;
}

    button:hover {
        box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1);
        z-index: 1;
        scale: 1.08;
    }

.sub-menu li a i {
    opacity: 0 !important;
}

textarea {
    width: 100% !important;
    text-align: left !important;
    min-height: 150px;
    padding-left: 15px;
    padding-top: 10px;
    border-radius: 5px;
    border: 1px solid #00000036;
}

input:focus {
    outline: 1px solid #796f57 !important;
}

select:focus {
    outline: 1px solid #796f57 !important;
}

textarea:focus {
    outline: 1px solid #796f57 !important;
}
/* General */

/* *************** DOC ***************** */

/* 1. UpperNav                  Styles */
/* 2. Navbar                    Styles */
/* 3. SideNav                   Styles */
/* 4. MovingNews                Styles */
/* 5. Landing                   Styles */
/* 6. ServicesHeader            Styles */
/* 7. Services                  Styles */
/* 8. Clients                   Styles */
/* 9. Footer                    Styles */
/* 10. Copyright                Styles */
/* 11. PageHeader               Styles */
/* 12. Support Form             Styles */
/* 13. Faqs                     Styles */
/* 14. Rate Content             Styles */
/* 15. laws-and-legistations    Styles */
/* 16. Comments                 Styles */
/* 17. services-page            Styles */
/* 18. service-cataloge-page    Styles */
/* 19. service-details          Styles */
/* 20. service-apply            Styles */
/* 21. contact-us-page          Styles */
/* 22. news-page                Styles */
/* 23. news-inner-page          Styles */
/* 24. publications-page        Styles */
/* 25. publication-sub-page     Styles */
/* 26. Events                   Styles */
/* 27. Events Inner             Styles */
/* 28. Media Page               Styles */
/* 29. advice-page              Styles */
/* 30. advice-inner-page        Styles */
/* 31. pen-data-form            Styles */
/* 32. polls-page               Styles  */
/* 33. policy page              Styles */
/* 34. open-data-main           Styles */
/* 35. usage-analytics-page     Styles */
/* 36. three-d-open-data        Styles */
/* 37. commander-talk           Styles */
/* 38. organization-page        Styles */
/* 40. overview-page            Styles */
/* 41. questionnaires-inner     Styles */
/* 42. Short cuts               Styles */

/* *************** DOC ***************** */

/* General Settings  */
/* Modefied by Yosef on 21-4-2025 */
.side-social-media {
    position: fixed;
    top: 50%;
    right: -55px;
    width: 100px;
    display: flex !important;
    flex-direction: column;
    transform: translateY(-50%);
    transition: 0.5s;
    z-index: 15;
    align-items: flex-end;
    flex-wrap: nowrap;
}

    .side-social-media:hover {
        right: 0;
    }

    .side-social-media.initial {
        right: 0;
    }

    .side-social-media .hover-ele,
    .side-social-media .hover-service {
        width: 50px;
        height: 50px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        background-color: #fff;
        border-radius: 8px;
        font-size: 25px;
    }

    .side-social-media .socials {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        background-color: var(--primary-color);
        color: #fff;
        width: 36px;
        padding-top: 20px;
        padding-bottom: 20px;
        border-radius: 8px 0 0 8px;
    }

        .side-social-media .socials a {
            color: #fff;
        }

.high-contrast {
    filter: contrast(1.5);
}

.socials a i {
    transition: 0.5s !important;
}

/* YouTube */
.socials a:nth-child(1):hover i,
.socials-formobile a:nth-child(1):hover i {
    color: #ff0000; /* YouTube red */
}

/* X (formerly Twitter) */
.socials a:nth-child(2):hover img,
.socials-formobile a:nth-child(2):hover img {
    filter: brightness(0) saturate(100%) invert(29%) sepia(95%) saturate(7493%) hue-rotate(194deg) brightness(88%) contrast(103%);
}

/* Instagram */
.socials a:nth-child(3):hover i,
.socials-formobile a:nth-child(3):hover i {
    color: #e1306c; /* Instagram pink */
}

/* LinkedIn */
.socials a:nth-child(4):hover i,
.socials-formobile a:nth-child(4):hover i {
    color: #0077b5; /* LinkedIn blue */
}

/* RSS */
.socials a:nth-child(5):hover i {
    color: #ff6600; /* RSS orange */
}

/* Facebook */
.socials a:nth-child(6):hover i {
    color: #1877f2; /* Facebook blue */
}

/* Google Play */
.socials a:nth-child(7):hover i {
    color: #34a853; /* Google Play green */
}

/* App Store */
.socials a:nth-child(8):hover img {
    filter: brightness(0) saturate(100%) invert(29%) sepia(95%) saturate(7493%) hue-rotate(194deg) brightness(88%) contrast(103%);
}

/* CSS for black and white color scheme */

.black-and-white {
    filter: grayscale(100%);
}

/* CSS for a larger cursor */
.large-cursor,
.large-cursor * {
    cursor: inherit; /* Example of a built-in cursor, adjust as needed */
}

/* Alternatively, use a built-in cursor style for larger size */
.large-cursor-builtin,
.large-cursor-builtin * {
    cursor: url("../images/cursor/cursornew.png"), auto; /* Custom large cursor */
}

/* CSS for highlighted headlines */
.highlighted-headlines h1,
.highlighted-headlines h2,
.highlighted-headlines h3,
.highlighted-headlines h4,
.highlighted-headlines h5,
.highlighted-headlines h6 {
    text-decoration: underline !important; /* Increase font size; adjust as needed */
    font-weight: bold !important;
}

/* CSS for highlighted headlines */
.highlighted-links a {
    text-decoration: underline !important; /* Increase font size; adjust as needed */
    font-weight: bold !important;
}

/* CSS for increased line height */
.increased-line-height {
    line-height: 1.6; /* Example of increased line height; adjust as needed */
}

    .increased-line-height p,
    .increased-line-height li,
    .increased-line-height h1,
    .increased-line-height h2,
    .increased-line-height h3,
    .increased-line-height h4,
    .increased-line-height h5,
    .increased-line-height h6 {
        line-height: 1.6; /* Ensure all text elements receive the increased line height */
    }

.img-description {
    display: block; /* Ensure it's displayed as a block-level element */
    background-color: #f8f8f8; /* Light background to make text readable */
    color: #000; /* Text color */
    text-align: center; /* Center-align the text */
    padding: 5px; /* Add some padding around the text */
    border-radius: 5px; /* Optional: round the corners */
    margin-top: 5px; /* Margin to separate the description from the image */
    font-size: 0.9em; /* Adjust font size as needed */
}

.hide-images {
    opacity: 0;
    transition: opacity 0.5s ease; /* Smooth transition for opacity change */
}

.desaturate {
    filter: saturate(0);
}

/* Loading Section */

#loading-screen {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: white;
    z-index: 1000;
    flex-direction: column;
    gap: 20px;
}

    #loading-screen img {
        width: 350px;
        height: 350px;
        object-fit: contain;
    }

#loading-bar {
    width: 33%;
    height: 13px;
    background-color: #e0e0e0;
    border-radius: 15px;
    overflow: hidden;
}

#loading-bar-fill {
    height: 100%;
    width: 0%;
    background-color: #2a2d6d;
    border-radius: 15px;
    transition: width 2s;
}

/* Loading Section */

/* Leaving Website alert */

#externalLinkPopup {
    position: fixed;
    right: 50%;
    top: 50%;
    transform: translate(50%, -50%);
    padding: 20px;
    background-color: white;
    border: 1px solid #ccc;
    box-shadow: 0px 0px 1px rgb(0 0 0 / 15%);
    z-index: 50000;
    border-radius: 12px;
    height: 200px;
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 418px;
    direction: ltr;
}

    #externalLinkPopup #continueButton {
        width: 120px !important;
    }

@media (max-width: 500px) {
    #externalLinkPopup {
        height: auto !important;
        width: 88% !important;
        justify-content: space-around;
        align-items: center;
        z-index: 10000000;
    }
}

#externalLinkPopup p {
    width: 100%;
    font-size: 17px;
    text-align: center;
    font-weight: 500;
    /* margin-bottom: 78px;*/
}

#externalLinkPopup button:nth-child(2) {
    width: 167px;
    height: 55px;
    border-radius: 10px;
    background-color: var(--primary-color);
    color: #fff;
    font-size: 16px;
    border: none;
}

#externalLinkPopup button:nth-child(3) {
    width: 120px;
    height: 55px;
    border-radius: 10px;
    background-color: #000000b3;
    color: #fff;
    font-size: 16px;
    border: none;
    outline: none;
}

/* Leaving website alert */

.dates-toggle-btns {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 63px;
    border: 2px solid #e8eef7;
    border-radius: 8px;
    margin-top: 25px;
    margin-bottom: 28px;
    border-radius: 8px;
    overflow: hidden;
}

.data-form-content {
    width: 100%;
    min-height: 900px;
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #d4dde9;
    padding: 25px;
}

    .data-form-content .data-form {
        min-height: 900px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-between;
    }

        .data-form-content .data-form .inputs {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            width: 100%;
            gap: 20px;
        }

            .data-form-content .data-form .inputs .input {
                width: 100%;
                position: relative;
                display: flex;
                flex-direction: column-reverse;
                align-items: flex-start;
                gap: 9px;
                margin-bottom: 32px;
            }

                .data-form-content .data-form .inputs .input label {
                    font-size: 16px;
                    font-weight: 500;
                    position: relative;
                    opacity: 1;
                    transition: 0.3s;
                }

                    .data-form-content .data-form .inputs .input label span {
                        color: red;
                    }

                .data-form-content .data-form .inputs .input input {
                    width: 100%;
                    height: 52px;
                    padding: 7px 20px 7px 20px;
                    border: 1px solid #dae2ee;
                    border-radius: 8px;
                    outline: none;
                    text-align: left;
                    font-size: 16px;
                }

                .data-form-content .data-form .inputs .input select {
                    width: 100%;
                    height: 52px;
                    padding: 7px 20px 7px 20px;
                    border: 1px solid #dae2ee;
                    border-radius: 8px;
                    direction: ltr;
                    outline: none;
                    font-size: 16px;
                    padding-right: 10px;
                }

                .data-form-content .data-form .inputs .input textarea {
                    width: 100%;
                    height: 225px;
                    padding: 7px 20px 7px 20px;
                    border: 1px solid #dae2ee;
                    border-radius: 8px;
                    outline: none;
                    text-align: left;
                    font-size: 16px;
                }

                    .data-form-content .data-form .inputs .input textarea:focus + label {
                        opacity: 0;
                        user-select: none;
                        pointer-events: none;
                    }

        .data-form-content .data-form .upload-input {
            width: 100%;
        }

            .data-form-content .data-form .upload-input label {
                width: 100%;
                text-align: left;
                font-size: 16px;
                font-weight: 500;
                padding: 15px;
            }

            .data-form-content .data-form .upload-input .upload-here {
                width: 100%;
                border: 3px dotted #d4dde9;
                border-radius: 8px;
                min-height: 200px;
                padding: 33px;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                text-align: center;
                position: relative;
            }

                .data-form-content .data-form .upload-input .upload-here span {
                    width: 56px;
                    height: 56px;
                    background-color: #f5f5f5;
                    border-radius: 50%;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    font-size: 30px;
                }

                .data-form-content .data-form .upload-input .upload-here h2 {
                    font-size: 15px;
                    text-align: center;
                    font-weight: 700;
                    color: #282828;
                }

                .data-form-content .data-form .upload-input .upload-here h3 {
                    font-size: 11px;
                    font-weight: 500;
                    text-align: center;
                    color: #282828;
                }

        .data-form-content .data-form .uploaded-files #fileList {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
            padding: 15px;
        }

            .data-form-content .data-form .uploaded-files #fileList div {
                font-size: 15px;
                background-color: #fff;
                border: 1px solid #d4dde9;
                padding: 5px;
                border-radius: 5px;
                padding-right: 15px;
                padding-left: 15px;
            }

        .data-form-content .data-form .buttons {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
        }

            .data-form-content .data-form .buttons button:nth-child(1) {
                width: 175px;
                height: 46px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                outline: none;
                border: none;
                background-color: var(--primary-color);
                font-weight: 500;
                font-size: 15px;
                border-radius: 7px;
                color: #fff;
            }

            .data-form-content .data-form .buttons button:nth-child(2) {
                width: 175px;
                height: 46px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                outline: none;
                border: none;
                background-color: #f5f5f5;
                font-weight: 500;
                font-size: 15px;
                border-radius: 7px;
            }

.dates-toggle-btns .years select {
    width: 107px;
    height: 44px;
    border: 1px solid #e6ecf5;
    padding: 8px;
    margin-right: 15px;
    direction: ltr;
    border-radius: 5px;
}

.dates-toggle-btns .months {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
}

    .dates-toggle-btns .months button {
        width: 100%;
        height: 63px;
        border: none;
        outline: none;
        background-color: transparent;
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        text-align: center;
        color: #000000;
    }

        .dates-toggle-btns .months button.active {
            background: var(--primary-color);
            color: #fff;
        }

.categories-toggle-btns {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    border-radius: 8px;
    overflow: hidden;
}

    .categories-toggle-btns .search button {
        background-color: transparent;
        outline: none;
        border: none;
        width: 72px;
        height: 63px;
        background: var(--primary-color);
        border-radius: 0 8px 8px 0;
    }

    .categories-toggle-btns .btns {
        width: 100%;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        height: 63px;
        border: 2px solid #e8eef7;
        border-radius: 8px;
    }

        .categories-toggle-btns .btns button {
            width: 100%;
            height: 63px;
            border: none;
            outline: none;
            background-color: transparent;
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: center;
            color: #000000;
        }

            .categories-toggle-btns .btns button.active {
                border-radius: 8px 0 0 8px;
                background: var(--primary-color);
                color: #fff;
            }

.inner-page .main-img img {
    width: 100%;
    object-fit: cover;
    height: 590px;
    border-radius: 15px;
}

.inner-page .inner-text {
    margin: 30px;
    margin-top: -60px;
    background-color: #fff;
    position: relative;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #eaeaea;
}

    .inner-page .inner-text .header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 20px;
    }

        .inner-page .inner-text .header .options {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 20px;
        }

            .inner-page .inner-text .header .options a {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 12px;
                width: 130px;
                height: 50px;
                border-radius: 8px;
                padding: 20px;
                background: #f5f7fa;
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: center;
                color: #2c2c2c;
            }

                .inner-page .inner-text .header .options a i {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    height: 32px;
                    width: 32px;
                    padding: 15px;
                    background: var(--primary-color);
                    border-radius: 8px;
                    font-size: 20px;
                    color: #fff;
                }

        .inner-page .inner-text .header h3 {
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            text-align: left;
            color: #808080;
        }

    .inner-page .inner-text h2 {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        color: #26283b;
        text-align: left;
        direction: ltr;
        margin-bottom: 40px;
    }

    .inner-page .inner-text p {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        color: #26283b;
        text-align: justify;
        text-align: left;
        direction: ltr;
        margin-bottom: 43px;
    }

/* Start Upper Nav Styles */

.upper-nav .upper-nav-content {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    min-height: 58px;
    padding-top: 11px;
    padding-bottom: 11px;
}

    .upper-nav .upper-nav-content .logo {
        display: flex;
        flex-direction: row;
        gap: 26px;
    }

        .upper-nav .upper-nav-content .logo img {
            width: 185px;
            height: 59px;
            object-fit: contain;
        }

/* End Upper Nav Styles */

/* Start Navbar Styles 

nav {
    background-color: var(--primary-color);
    transition: 0.5s;
    width: 100%;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 15000;
}

nav .nav-content {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    height: 63px;
}

    nav .nav-content .nav-elements {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
    }

        nav .nav-content .nav-elements .nav-element {
            border-radius: 8px;
            padding: 5px 17px 5px 17px;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 10px;
            background-color: var(--secondary-color);
            height: 45px;
            position: relative;
        }

            nav .nav-content .nav-elements .nav-element > a {
                color: #fff;
                font-weight: 500;
                font-size: 13px;
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 6px;
            }

                nav .nav-content .nav-elements .nav-element > a:nth-child(1) i {
                    font-size: 18px;
                }

        nav .nav-content .nav-elements:nth-child(2) .nav-element:nth-child(3) {
            padding: 0;
        }

            nav .nav-content .nav-elements:nth-child(2) .nav-element:nth-child(3) button {
                width: 50px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                height: 100%;
            }

                nav
                .nav-content
                .nav-elements:nth-child(2)
                .nav-element:nth-child(3)
                button
                img {
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                    width: 25px;
                }

        nav .nav-content .nav-elements .nav-element > a:nth-child(1):not(.home) {
            height: 34px;
            width: 175px;
            background-color: #796f57;
            border-radius: 5px;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            color: #000;
            padding: 5px;
            justify-content: center;
            font-size: 10px;
            font-weight: 600;
            text-wrap: nowrap;
            color: #fff;
        }

        nav .nav-content .nav-elements .nav-element > button {
            background-color: transparent;
            outline: none;
            border: none;
            color: #fff;
            display: flex;
            align-items: center;
            gap: 10px;
            font-weight: 500;
            font-size: 14px;
        }

            nav .nav-content .nav-elements .nav-element > button img {
                width: 100%;
                height: 100%;
                object-fit: contain;
            }

        nav .nav-content .nav-elements .nav-element .toggle-menu {
            display: none;
        }

        nav .nav-content .nav-elements .nav-element #langs-menu {
            display: block;
            position: absolute;
            border-radius: 9px;
            padding: 15px;
            width: 343px;
            min-height: 257px;
            background-color: #fff;
            z-index: 15;
            top: 46px;
            right: 50%;
            transform: translateX(50%);
            transition: 0.5s;
            opacity: 0;
            user-select: none;
            pointer-events: none;
        }

            nav .nav-content .nav-elements .nav-element #langs-menu.active {
                opacity: 1;
                user-select: inherit;
                pointer-events: inherit;
            }

            nav
            .nav-content
            .nav-elements
            .nav-element
            #langs-menu
            .langs-menu-content
            .langs {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
            }

                nav
                .nav-content
                .nav-elements
                .nav-element
                #langs-menu
                .langs-menu-content
                .langs
                a {
                    width: 151px;
                    height: 44px;
                    border-radius: 6px;
                    padding: 2px 6px 2px 6px;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    font-weight: 500;
                    font-size: 16px;
                    line-height: 26px;
                    color: #000;
                    background-color: #e7e7e7;
                    transition: 0.5s;
                }

                    nav
                    .nav-content
                    .nav-elements
                    .nav-element
                    #langs-menu
                    .langs-menu-content
                    .langs
                    a.active {
                        background-color: var(--primary-color);
                        color: #fff;
                    }

            nav .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content h4 {
                margin-top: 30px;
                margin-bottom: 10px;
                font-size: 13px;
                font-weight: 500;
                text-align: left;
                padding-left: 2px;
            }

            nav
            .nav-content
            .nav-elements
            .nav-element
            #langs-menu
            .langs-menu-content
            select {
                width: 100%;
                height: 46px;
                padding: 9px 10px 9px 8px;
                display: flex;
                flex-direction: row-reverse;
                align-items: center;
                justify-content: space-between;
                background-color: #fff;
                border: 1px solid #e8eef7;
                outline: none;
                font-weight: 500;
                font-size: 14px;
                border-radius: 6px;
                direction: ltr;
            }

            nav
            .nav-content
            .nav-elements
            .nav-element
            #langs-menu
            .langs-menu-content
            .warning-msg {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                text-align: center;
                background-color: #fff9ef;
                border: 1px solid #c4a68f;
                min-height: 61px;
                width: 100%;
                border-radius: 6px;
                padding: 19px;
                direction: ltr;
                margin-top: 19px;
            }

                nav
                .nav-content
                .nav-elements
                .nav-element
                #langs-menu
                .langs-menu-content
                .warning-msg
                p {
                    text-align: center;
                    font-weight: 500;
                    font-size: 10px;
                    color: #000;
                    margin: 0;
                }

        nav .nav-content .nav-elements .nav-element > span {
            height: 21px;
            width: 1px;
            display: flex;
            background-color: #ffffff5e;
        }

        nav .nav-content .nav-elements .nav-element .search-input {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 17px;
            height: 100%;
        }

            nav .nav-content .nav-elements .nav-element .search-input > button {
                background-color: transparent;
                outline: none;
                border: none;
                font-size: 14px;
            }

            nav .nav-content .nav-elements .nav-element .search-input > input {
                background-color: transparent;
                outline: none;
                border: none;
                color: #fff;
                text-align: left;
                color: #fff;
                font-size: 14px;
                width: 230px;
                height: 100%;
                padding-left: 10px;
            }

        nav .nav-content .nav-elements .nav-element #adv-search {
            display: block;
            position: absolute;
            border-radius: 9px;
            padding: 15px;
            width: 891px;
            min-height: 264px;
            background-color: #fff;
            z-index: 15;
            top: 46px;
            right: 50%;
            transform: translateX(50%);
            transition: 0.5s;
            opacity: 0;
            user-select: none;
            pointer-events: none;
        }

            nav .nav-content .nav-elements .nav-element #adv-search.active {
                opacity: 1;
                user-select: inherit;
                pointer-events: inherit;
            }

            nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content {
                width: 100%;
                min-height: 230px;
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                justify-content: space-between;
            }

                nav
                .nav-content
                .nav-elements
                .nav-element
                #adv-search
                .adv-search-content
                .inputs {
                    width: 100%;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: space-between;
                    gap: 10px;
                }

                    nav
                    .nav-content
                    .nav-elements
                    .nav-element
                    #adv-search
                    .adv-search-content
                    .inputs
                    .input {
                        display: flex;
                        flex-direction: column;
                        align-items: flex-end;
                        width: 100%;
                    }

                        nav
                        .nav-content
                        .nav-elements
                        .nav-element
                        #adv-search
                        .adv-search-content
                        .inputs
                        .input
                        label {
                            padding-left: 6px;
                            font-weight: 500;
                            font-size: 14px;
                            margin-top: 15px;
                            margin-bottom: 15px;
                            text-align: left !important;
                        }

                        nav
                        .nav-content
                        .nav-elements
                        .nav-element
                        #adv-search
                        .adv-search-content
                        .inputs
                        .input
                        select {
                            width: 100%;
                            height: 52px;
                            border-radius: 8px;
                            border: 1px solid #e8eef7;
                            outline: none;
                            padding: 9px 19px 9px 19px;
                            direction: ltr;
                            display: flex;
                            flex-direction: row-reverse;
                            align-items: center;
                            justify-content: space-between;
                        }

                        nav
                        .nav-content
                        .nav-elements
                        .nav-element
                        #adv-search
                        .adv-search-content
                        .inputs
                        .input
                        input {
                            width: 100%;
                            height: 52px;
                            border-radius: 8px;
                            border: 1px solid #e8eef7;
                            outline: none;
                            padding: 9px 19px 9px 19px;
                            direction: ltr;
                            display: flex;
                            flex-direction: row-reverse;
                            align-items: center;
                            justify-content: space-between;
                        }

                        nav
                        .nav-content
                        .nav-elements
                        .nav-element
                        #adv-search
                        .adv-search-content
                        .inputs
                        .input
                        div {
                            display: flex;
                            flex-direction: row;
                            align-items: center;
                            gap: 10px;
                        }

                        nav
                        .nav-content
                        .nav-elements
                        .nav-element
                        #adv-search
                        .adv-search-content
                        .inputs
                        .input
                        input::placeholder {
                            color: #999292;
                        }

                        nav
                        .nav-content
                        .nav-elements
                        .nav-element
                        #adv-search
                        .adv-search-content
                        .inputs
                        .input
                        select::placeholder {
                            color: #000;
                        }

                nav
                .nav-content
                .nav-elements
                .nav-element
                #adv-search
                .adv-search-content
                .btns {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    gap: 15px;
                }

                    nav
                    .nav-content
                    .nav-elements
                    .nav-element
                    #adv-search
                    .adv-search-content
                    .btns
                    button {
                        height: 38px;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                        gap: 15px;
                        border-radius: 6px;
                        border: none;
                        outline: none;
                    }

                        nav
                        .nav-content
                        .nav-elements
                        .nav-element
                        #adv-search
                        .adv-search-content
                        .btns
                        button.start-adv-search {
                            width: 154px;
                            background-color: var(--primary-color);
                            color: #fff;
                        }

                        nav
                        .nav-content
                        .nav-elements
                        .nav-element
                        #adv-search
                        .adv-search-content
                        .btns
                        button.clear-inputs-adv-search {
                            background-color: #e7e7e7;
                            color: #26283b;
                            width: 80px;
                        }

.custom-date-input {
    position: relative;
    display: inline-block;
    width: 100%;  Ensure the container takes the full width 
}

    .custom-date-input .actual-date-input {
        position: absolute !important;
        opacity: 0;
        width: 100%;
        height: 100%;
        cursor: pointer;
        z-index: 2;
        top: 0;
        right: 0;
    }

    .custom-date-input .date-display {
        border: 1px solid #ccc;
        padding: 8px 2em 8px 8px;  Adjust left padding to make space for the icon 
        width: calc( 100% - 30px );  Adjust the width to account for icon space, if necessary 
        margin-right: 8px;  Space between icon and input, adjust if the icon is inside the input area 
        position: relative;
        z-index: 1;
    }

.date-input {
    font-size: 20px;  Adjust icon size as needed 
    position: absolute;
    right: 10px;  Adjust based on your design 
    z-index: 3;  Ensure the icon is above the transparent input 
    color: #999292;
}

 End Navbar Styles */

/* Start Side Nav Styles */

/*.side-nav {
    position: fixed;
    left: 0;
    top: 76px;
    background-color: #fff;
    height: auto;
    width: 386px;
    bottom: 0;
    z-index: 2000000;
    border: 1px solid #00000014;
    padding-right: 10px;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    transition: 0.5s;
    left: -1000px;
}*/


.side-nav.active {
    left: 0;
}

.side-nav .side-nav-content {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    /* Modefied by Yosef on 24-4-2025 */
    height: 100%;
    overflow: scroll;
}

    /* width */
    .side-nav .side-nav-content::-webkit-scrollbar {
        width: 0;
        height: 0;
    }

    /* Track */
    .side-nav .side-nav-content::-webkit-scrollbar-track {
        background: #f1f1f1;
        width: 0;
        height: 0;
    }

    /* Handle */
    .side-nav .side-nav-content::-webkit-scrollbar-thumb {
        background: #888;
        width: 0;
        height: 0;
    }

        /* Handle on hover */
        .side-nav .side-nav-content::-webkit-scrollbar-thumb:hover {
            background: #555;
            width: 0;
            height: 0;
        }

    .side-nav .side-nav-content > button {
        position: absolute;
        right: -40px;
        background-color: #fff;
        border: none;
        outline: none;
        border-radius: 0 6px 6px 0;
        padding: 8px 13px 8px 13px;
        width: 40px;
        height: 40px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        z-index: 19;
        border-left: 1px solid #0000000f;
        font-size: 18px;
        color: #000;
        transition: 0.5s;
    }

    .side-nav .side-nav-content .main-menu {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 17px;
    }

        .side-nav .side-nav-content .main-menu > li {
            width: 100%;
        }

            .side-nav .side-nav-content .main-menu > li a {
                width: 100%;
                min-height: 37px;
                border-radius: 5px;
                padding: 10px 20px 10px 20px !important;
                font-size: 15px;
                color: #0d0d0d;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: flex-end;
                border: none;
                outline: none;
                background-color: #faf9f8;
                font-weight: 500;
                transition: 0.5s;
                text-align: left;
            }

                .side-nav .side-nav-content .main-menu > li a.active {
                    background-color: var(--primary-color);
                    color: #fff;
                }

            .side-nav .side-nav-content .main-menu > li > button {
                width: 100%;
                min-height: 37px;
                border-radius: 5px;
                padding: 10px 20px 10px 20px !important;
                font-size: 15px;
                color: #0d0d0d;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
                border: none;
                outline: none;
                background-color: #faf9f8;
                font-weight: 500;
                transition: 0.5s;
            }

                .side-nav .side-nav-content .main-menu > li > button.active {
                    background-color: var(--primary-color);
                    color: #fff;
                }

                .side-nav .side-nav-content .main-menu > li > button:hover {
                    background-color: var(--primary-color);
                    color: #fff;
                }

        .side-nav .side-nav-content .main-menu .sub-menu {
            padding: 10px;
            margin: 10px;
            display: flex;
            flex-direction: column;
            background-color: #f1f1f1;
        }

            .side-nav .side-nav-content .main-menu .sub-menu ul {
                display: flex;
                flex-direction: column;
                align-items: flex-end;
                width: 100%;
                gap: 9px;
            }

                .side-nav .side-nav-content .main-menu .sub-menu ul li {
                    width: 100%;
                }

                    .side-nav .side-nav-content .main-menu .sub-menu ul li a {
                        gap: 5px;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        width: 100%;
                        font-weight: 500;
                        font-size: 13px;
                        color: #26283b;
                        justify-content: space-between;
                        transition: 0.5s;
                        border-bottom: 1px solid transparent;
                        background-color: #fff;
                    }

                        .side-nav .side-nav-content .main-menu .sub-menu ul li a:hover {
                            border-bottom: 1px solid var(--primary-color);
                            background-color: #f1f1f1;
                        }

        .side-nav .side-nav-content .main-menu > li .menu-links-options {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            border: 1px solid #00000012;
            border-radius: 7px;
        }

            .side-nav .side-nav-content .main-menu > li .menu-links-options > a {
                width: 100%;
                height: 42px;
                font-weight: 500;
                font-size: 14px;
                color: #0d0d0d;
                padding: 10px 15px 10px 15px;
                text-align: left;
                display: flex;
                flex-direction: column;
                align-items: flex-end;
                border: 1px solid #00000014;
                border-top: 0;
            }

            .side-nav .side-nav-content .main-menu > li .menu-links-options .option {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
                width: 100%;
                padding: 10px 15px 10px 15px;
            }

                .side-nav
                .side-nav-content
                .main-menu > li
                .menu-links-options
                .option
                .switch-color-btns {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    gap: 5px;
                }

                    .side-nav
                    .side-nav-content
                    .main-menu > li
                    .menu-links-options
                    .option
                    .switch-color-btns
                    button {
                        width: 18px;
                        height: 18px;
                        border-radius: 50%;
                        border: none;
                        outline: none;
                        cursor: pointer;
                    }

                        .side-nav
                        .side-nav-content
                        .main-menu > li
                        .menu-links-options
                        .option
                        .switch-color-btns
                        button.switch-to-light {
                            background-color: #e1e0e0;
                        }

                        .side-nav
                        .side-nav-content
                        .main-menu > li
                        .menu-links-options
                        .option
                        .switch-color-btns
                        button.switch-to-dark {
                            background-color: #7a6f57;
                            border: 2px solid #000;
                        }

                .side-nav .side-nav-content .main-menu > li .menu-links-options .option h3 {
                    font-weight: 500;
                    font-size: 14px;
                    color: #0d0d0d;
                    text-align: left;
                    margin: 0;
                }

    .side-nav .side-nav-content .our-app {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin-top: 16px;
    }

        .side-nav .side-nav-content .our-app h2 {
            font-weight: 500;
            font-size: 16px;
            text-align: center;
            line-height: 23px;
        }

        .side-nav .side-nav-content .our-app .app-links {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
            flex-wrap: wrap;
            margin-top: 8px;
        }

/* End Side Nav Styles */



/* Start Landing Styles */

.landing .landing-content .toggle-screen-btns-container {
    width: 100%;
    /*overflow-x: scroll;*/
    direction: rtl;
}

.landing .landing-content .toggle-screen-btns {
    width: fit-content;
    direction: rtl;
}

    .landing .landing-content .toggle-screen-btns button {
        width: 150px;
    }


.landing .landing-content .toggle-screen-btns {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}

    .landing .landing-content .toggle-screen-btns button {
        width: 100%;
        height: 54px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        border: none;
        outline: none;
        color: #26283b;
        font-weight: 700;
        font-size: 14px;
        text-align: center;
        background-color: #f7f6f5;
        transition: 0.5s;
        border-left: 1px solid #0000001c;
        border-top: 1px solid #0000001c;
        scale: 1 !important;
    }

        .landing .landing-content .toggle-screen-btns button.active {
            border-radius: 5px 5px 0 0;
            border-bottom: 5px solid #5c4e2e;
            background-color: var(--primary-color);
            color: #fff;
        }

.landing .screens {
}

    .landing .screens .screen {
        height: 500px;
        position: relative;
        opacity: 0;
        user-select: none;
        pointer-events: none;
        height: 0 !important;
    }

        .landing .screens .screen.active {
            height: 500px;
            position: relative;
            opacity: 1;
            user-select: inherit;
            pointer-events: inherit;
            height: 100% !important;
        }

        .landing .screens .screen .new-about-police {
            height: 500px;
        }

            .landing .screens .screen .new-about-police .images-slider {
                height: 500px;
            }

                .landing .screens .screen .new-about-police .images-slider .slide {
                    height: 500px;
                }



                    .landing .screens .screen .new-about-police .images-slider .slide .links {
                        position: absolute;
                        bottom: 4%;
                        /*left: 5%;*/
                        gap: 15px;
                        display: flex;
                        flex-direction: row;
                        gap: 30px;
                        z-index: 5;
                    }

                        .landing .screens .screen .new-about-police .images-slider .slide .links a {
                            display: flex;
                            flex-direction: row;
                            align-items: center;
                            justify-content: center;
                            background-color: var(--primary-color);
                            width: 150px;
                            height: 40px;
                            border-radius: 5px;
                            color: #fff;
                        }

            .landing .screens .screen .new-about-police .slider-btns {
                position: absolute;
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 15px;
                left: 20px;
                bottom: 20px;
            }

                .landing .screens .screen .new-about-police .slider-btns button {
                    width: 50px;
                    height: 50px;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    color: #fff;
                    background-color: var(--primary-color);
                    border-radius: 3px;
                    border: none;
                    outline: none;
                }

        .landing .screens .screen .our-services {
            position: relative;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 500px;
        }

            .landing .screens .screen .our-services > img {
                inset: 0;
                width: 100%;
                height: 100%;
                position: absolute;
                object-fit: cover;
            }

            .landing .screens .screen .our-services > .overlay {
            }

            .landing .screens .screen .our-services > h1 {
                position: relative;
                font-weight: 700;
                font-size: 27px;
                text-align: center;
            }

            .landing .screens .screen .our-services .landing-services-search {
                position: relative;
                margin-top: 25px;
                display: flex;
                flex-direction: row;
                align-items: center;
                width: 100%;
                justify-content: center;
                gap: 15px;
                margin-bottom: 25px;
            }

                .landing .screens .screen .our-services .landing-services-search a {
                    width: 235px;
                    height: 57px;
                    background-color: var(--primary-color);
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    color: #fff;
                    border-radius: 43px;
                }

                .landing .screens .screen .our-services .landing-services-search .input {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    width: 680px;
                    height: 57px;
                    position: relative;
                }

                    .landing .screens .screen .our-services .landing-services-search .input input {
                        width: 100%;
                        height: 100%;
                        border-radius: 50px;
                        color: #000;
                        border: 1px solid #c8d7ee;
                        padding-left: 10px;
                        direction: ltr;
                        font-size: 15px;
                        outline: none;
                        padding-left: 27px;
                        padding-right: 35px;
                    }

                        .landing
                        .screens
                        .screen
                        .our-services
                        .landing-services-search
                        .input
                        input::placeholder {
                            color: #26293e;
                        }


        .landing .screens .screen .support-help .options a {
            width: 32.25%;
        }


        .landing .screens .screen .our-services .landing-services-search .input button {
            background-color: transparent;
            outline: none;
            border: none;
            position: absolute;
            right: 30px;
            top: 50%;
            transform: translateY(-50%);
        }

        .landing .screens .screen .our-services .landing-services {
            position: relative;
            width: 100%;
        }

            .landing .screens .screen .our-services .landing-services .slider-btns {
                position: absolute;
                top: 50%;
                right: 50%;
                transform: translate(50%, -50%);
                width: 107%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
                padding: 15px;
                z-index: 15;
                height: 0;
                padding: 0;
            }

                .landing .screens .screen .our-services .landing-services .slider-btns button {
                    background-color: transparent;
                    outline: none;
                    border: none;
                    font-size: 72px;
                    color: var(--primary-color);
                }

            .landing .screens .screen .our-services .landing-services .services-slider {
                position: relative;
                width: 100%;
                min-height: 225px;
            }

                .landing
                .screens
                .screen
                .our-services
                .landing-services
                .services-slider
                .slide
                .service {
                    width: 278px;
                    min-height: 226px;
                    background-color: #fff;
                    border-radius: 8px;
                    padding: 28px 28px 28px 28px;
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: center;
                    margin-right: 0;
                    gap: 18px;
                    margin-right: 15px;
                    margin-left: 15px;
                }

        .landing .screens .screen .our-services .landing-services {
            position: relative;
            width: 95%;
        }

            .landing
            .screens
            .screen
            .our-services
            .landing-services
            .services-slider
            .slide
            .service
            h2 {
                text-align: center;
                font-weight: 500;
                font-size: 17px;
                color: #000;
            }

        .landing .screens .screen .our-services .identity-number-search {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
            margin-top: 20px;
        }

            .landing .screens .screen .our-services .identity-number-search .input {
                position: relative;
                width: 455px;
                height: 50px;
            }

                /*  .landing .screens .screen .our-services .identity-number-search .input button {
                    position: absolute;
                    right: 0;
                    height: 100%;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    gap: 15px;
                    background-color: var(--primary-color);
                    color: #fff;
                    width: 127px;
                    border-radius: 50px;
                    justify-content: center;
                    border: none;
                    outline: none;
                }*/

                .landing .screens .screen .our-services .identity-number-search .input input {
                    width: 100%;
                    background-color: #fff;
                    color: #000;
                    font-size: 16px;
                    padding-left: 20px;
                    padding-right: 130px;
                    height: 100%;
                    text-align: left;
                    border-radius: 50px;
                    border: none;
                    outline: none;
                    font-weight: 500;
                }

            .landing .screens .screen .our-services .identity-number-search h3 {
                font-weight: 700;
                font-size: 16px;
                color: #26283b;
                margin: 0;
            }

        .landing .screens .screen .last-news {
            position: relative;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 500px;
        }

            .landing .screens .screen .last-news > img {
                inset: 0;
                width: 100%;
                height: 100%;
                position: absolute;
                object-fit: cover;
            }

            .landing .screens .screen .last-news > .overlay {
            }

            .landing .screens .screen .last-news .all-news {
                position: relative;
                width: 100%;
                height: 415px;
            }

                .landing .screens .screen .last-news .all-news .slider-btns {
                    position: absolute;
                    top: 50%;
                    right: 50%;
                    transform: translate(50%, -50%);
                    width: 107%;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: space-between;
                    padding: 15px;
                    z-index: 15;
                    height: 0;
                    padding: 0;
                }

                    .landing .screens .screen .last-news .all-news .slider-btns button {
                        background-color: transparent;
                        outline: none;
                        border: none;
                        font-size: 72px;
                        color: var(--primary-color);
                    }

                .landing .screens .screen .last-news .all-news .news-slider {
                    position: relative;
                    width: 100%;
                    height: 225px;
                }

                    .landing .screens .screen .last-news .all-news .news-slider .slide .blog {
                        width: 364px;
                        min-height: 415px;
                        position: relative;
                        margin-right: 40px;
                        margin-left: 27px;
                    }

                        .landing .screens .screen .last-news .all-news .news-slider .slide .blog img {
                            width: 100%;
                            height: 275px;
                            border-radius: 10px;
                            object-fit: cover;
                        }

                        .landing .screens .screen .last-news .all-news .news-slider .slide .blog .text {
                            width: 90%;
                            background-color: #fff;
                            position: absolute;
                            bottom: 34px;
                            right: 50%;
                            transform: translateX(50%);
                            border-radius: 10px;
                            padding: 26px;
                            min-height: 170px;
                            text-align: left;
                            justify-content: space-between;
                            display: flex;
                            flex-direction: column;
                        }

                            .landing
                            .screens
                            .screen
                            .last-news
                            .all-news
                            .news-slider
                            .slide
                            .blog
                            .text
                            h4 {
                                font-weight: 500;
                                font-size: 13px;
                                color: #808080;
                                direction: ltr;
                            }

                            .landing
                            .screens
                            .screen
                            .last-news
                            .all-news
                            .news-slider
                            .slide
                            .blog
                            .text
                            p {
                                font-weight: 700;
                                font-size: 16px;
                                color: #26283b;
                            }

                            .landing
                            .screens
                            .screen
                            .last-news
                            .all-news
                            .news-slider
                            .slide
                            .blog
                            .text
                            a {
                                font-weight: 500;
                                font-size: 13px;
                                color: #063579;
                                display: flex;
                                flex-direction: row;
                                align-items: center;
                                gap: 15px;
                            }

            .landing .screens .screen .last-news > a {
                position: relative;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                width: 309px;
                height: 46px;
                background-color: var(--primary-color);
                border-radius: 50px;
                color: #fff;
                font-weight: 500;
                font-size: 15px;
            }

        .landing .screens .screen .support-help {
            position: relative;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 500px;
        }

            .landing .screens .screen .support-help > img {
                inset: 0;
                width: 100%;
                height: 100%;
                position: absolute;
                object-fit: cover;
                opacity: 0.1;
            }

            .landing .screens .screen .support-help > .overlay {
            }

            .landing .screens .screen .support-help .ask-question button {
                background-color: transparent;
                outline: none;
                border: none;
                position: absolute;
                right: 30px;
                top: 50%;
                transform: translateY(-50%);
            }

            .landing .screens .screen .support-help .ask-question {
                position: relative;
                margin-top: 35px;
                display: flex;
                flex-direction: row;
                align-items: center;
                width: 685px;
                justify-content: center;
                gap: 15px;
                margin-bottom: 35px;
            }

                .landing .screens .screen .support-help .ask-question button img {
                    filter: invert(1);
                }

                .landing .screens .screen .support-help .ask-question input {
                    width: 682px;
                    height: 57px;
                    border-radius: 50px;
                    color: #000;
                    border: 1px solid #c8d7ee;
                    padding-left: 10px;
                    direction: ltr;
                    font-size: 15px;
                    outline: none;
                    padding-left: 27px;
                    padding-right: 35px;
                }

            .landing .screens .screen .support-help .options {
                display: flex;
                flex-direction: row;
                align-items: center;
                flex-wrap: wrap;
                position: relative;
                gap: 15px;
                width: 85%;
            }

                .landing .screens .screen .support-help .options a {
                    width: 32.33%;
                }

                    .landing .screens .screen .support-help .options a .option {
                        width: 100%;
                        height: 164px;
                        border-radius: 8px;
                        display: flex;
                        flex-direction: column;
                        align-items: flex-start;
                        justify-content: space-between;
                        padding: 16px;
                        background-color: #fff;
                        border: 1px solid #e3d8cd;
                        box-shadow: 0px 0px 14px 0px #00000008;
                    }

                        .landing .screens .screen .support-help .options a .option img {
                        }

                        .landing .screens .screen .support-help .options a .option h2 {
                            font-weight: 500;
                            font-size: 12px;
                            color: #26283b;
                            width: 100%;
                            text-align: left;
                        }

                        .landing .screens .screen .support-help .options a .option h1 {
                            font-weight: 500;
                            font-size: 19px;
                            text-align: left;
                            width: 100%;
                            color: #26283b;
                        }

            .landing .screens .screen .support-help > a {
                position: relative;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                width: 309px;
                height: 46px;
                background-color: var(--primary-color);
                border-radius: 50px;
                color: #fff;
                font-weight: 500;
                font-size: 15px;
                margin-top: 50px;
            }

/* End Landing Styles */

/* Start Services Header Section */

.services-header {
    margin-top: 30px;
    margin-bottom: 30px;
}

    .services-header .service-header-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 30px;
    }

/*        .services-header .service-header-content .options {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 18px;
        }*/

.services .container .slider-buttons {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    justify-content: center;
    margin-top: 20px;
}

    .services .container .slider-buttons button {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        border-radius: 50%;
        border: 1px solid #ebeef7;
        background-color: #fff;
    }

.services-header .service-header-content .options a {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 108px;
    height: 38px;
    border-radius: 50px;
    border: 1px solid #ebeef7;
    background-color: #fff;
    font-weight: 500;
    font-size: 13px;
    color: #26293e;
}

.services-header .service-header-content .options .input {
    width: 233px;
    height: 38px;
    position: relative;
}

    .services-header .service-header-content .options .input button {
        position: absolute;
        right: 17px;
        top: 50%;
        transform: translateY(-50%);
        outline: none;
        border: none;
        background-color: transparent;
    }

        .services-header .service-header-content .options .input button img {
            width: 15px;
        }

    .services-header .service-header-content .options .input input {
        width: 100%;
        height: 100%;
        border-radius: 50px;
        text-align: left;
        padding-left: 17px;
        padding-right: 17px;
        outline: none;
        border: 1px solid #e8eef7;
    }

        .services-header .service-header-content .options .input input::placeholder {
            color: #26293e;
        }

.services-header .service-header-content h1 {
    font-weight: 700;
    font-size: 27px;
    text-align: left;
    color: #26283b;
    margin-top: 15px;
}

.services-header .toggle-services-categories-btns {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: flex-start !important;
    gap: 20px;
}

    .services-header .toggle-services-categories-btns button {
        background-color: transparent;
        outline: none;
        border: none;
        height: 54px;
        padding: 8px 6px 8px 6px;
        font-size: 15px;
        font-weight: 600;
        text-align: center;
        color: #26293e;
        transition: 0.5s;
    }

        .services-header .toggle-services-categories-btns button.active {
            color: var(--primary-color);
            border-bottom: 6px solid var(--primary-color);
        }
/* Modefied by Yosef on 28-4-2025 */
.toggle-police-stations-container .toggle-police-stations-categories-btns button.active {
    color: var(--primary-color);
    border-bottom: 6px solid var(--primary-color);
}

.contact-us-page .police-stations .stations {
    display: none !important;
}

    .contact-us-page .police-stations .stations.active {
        display: flex !important;
    }

.station .update-map {
    cursor: pointer;
}

    .station .update-map.active {
        background-color: #dbc4ab !important;
        color: white !important;
        border-radius: 5px;
        box-shadow: 1px 2px 3px grey;
    }
/* End Services Header Section */
/* Start Services Section */
.services {
}

    /*    .services .services-categories {
        margin-bottom: 70px;
    }
*/
    .services .services-categories .category {
        display: none;
    }

        .services .services-categories .category.active {
            display: block;
        }

    .services .services-categories .normal-eles {
        display: flex;
        flex-direction: row-reverse;
        gap: 15px;
        flex-wrap: wrap;
    }

    .services
    .services-categories
    .category
    .category-services-slider
    .slide
    .service {
        width: 250px;
        height: 250px;
        background-color: #fff;
        border-radius: 8px;
        padding: 24px 28px 24px 28px;
        display: flex;
        flex-direction: column;
        /*align-items: flex-end;*/
        justify-content: space-between;
        border: 2px solid #e8eef7;
        margin-top: 15px;
        margin-bottom: 15px;
    }

        .services
        .services-categories
        .category
        .category-services-slider
        .slide
        .service
        img {
            width: 105px;
            height: 80px;
        }

        .services
        .services-categories
        .category
        .category-services-slider
        .slide
        .service
        h1 {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: left;
            width: 100%;
        }

        .services
        .services-categories
        .category
        .category-services-slider
        .slide
        .service
        div {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            width: 100%;
        }

        .services
        .services-categories
        .category
        .category-services-slider
        .slide
        .service
        a {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            width: 80px;
            height: 31px;
            font-size: 11px;
            font-weight: 500;
            text-align: left;
            background: #26283b;
            border-radius: 5px;
            color: #26283b;
        }

            .services
            .services-categories
            .category
            .category-services-slider
            .slide
            .service
            a:nth-child(1) {
                background: #f2f6fb;
            }

            .services
            .services-categories
            .category
            .category-services-slider
            .slide
            .service
            a:nth-child(2) {
                background: var(--primary-color);
                color: #fff;
            }

/* End Services Section */
.chart-block {
    cursor: pointer;
    padding: 10px;
    border: 1px solid #ccc;
    margin: 5px;
    border-radius: 5px;
    background-color: #f1f1f1;
    text-align: center;
    min-width: fit-content;
}

.chart-display {
    text-align: center;
    margin: 20px auto;
    width: 100%;
    height: 60vh;
    background-color: #ffffff;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
/*    .chart-display canvas {
        width: 400px !important;
        height: 400px !important;
        margin: auto
    }*/
.chart-container {
    overflow-x: auto; /* لتفعيل scroll أفقي */
    overflow-y: hidden; /* إخفاء التمرير العمودي لو حصل */
    white-space: nowrap; /* يمنع لف العناصر لسطر جديد */
    padding: 10px;
    scroll-behavior: smooth; /* سلوك تمرير سلس */
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}

    .chart-container .chart-block.active {
        background-color: #dbc4ab !important;
        color: white !important;
        border-radius: 5px;
        box-shadow: 1px 2px 3px grey;
    }

/* Start Clients Section */

.clients {
    background-image: url("https://www.shjpolice.gov.ae/images/clients/back.svg");
    /*background-image: url('../images/clients/back.webp');*/
    background-size: cover;
    background-position: center;
    min-height: 540px;
    padding-top: 0;
    margin-top: 0;
    background-repeat: no-repeat;
    /*background-position: top;*/
}

    .clients .client {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
    }

        .clients .client > img {
            width: 90px;
        }

        .clients .client a:nth-child(2) img {
            width: 35px;
        }

        .clients .client a:nth-child(3) img {
            width: 33px;
        }

        .clients .client a {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
        }

            .clients .client a img {
                width: 75%;
                height: 80px;
                object-fit: contain;
            }

/* End Clients Section */

/* Start Footer Section */

footer {
    background-color: var(--primary-color);
    position: relative;
    padding-top: 15px;
}

    footer .curve-1 img {
        width: 100%;
        top: -70px;
        position: absolute;
        left: 0;
        z-index: 1;
    }

    footer .curve-2 img {
        position: absolute;
        bottom: 0;
        width: 100%;
        top: -68px;
        right: 0;
        left: 0;
        z-index: 2;
        background-color: transparent;
    }

    footer .upper-footer-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding-bottom: 15px;
        border-bottom: 1px solid #e5eaf2;
        padding-top: 15px;
        position: relative;
        z-index: 5;
    }

        footer .upper-footer-content .socials {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 10px;
        }

            footer .upper-footer-content .socials a {
                width: 30px;
                height: 30px;
                object-fit: contain;
                padding: 5px;
                background-color: var(--secondary-color);
                border-radius: 5px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                color: #fff;
                font-size: 18px;
            }

                footer .upper-footer-content .socials a img {
                    width: 25px;
                    height: 25px;
                    object-fit: contain;
                    padding: 5px;
                    background-color: var(--secondary-color);
                    border-radius: 5px;
                }

            footer .upper-footer-content .socials .clients-stats {
                display: flex;
                flex-direction: row;
            }

.upper-footer-content .clients-stats {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

footer .upper-footer-content ul {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    margin: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 30px;
}

    footer .upper-footer-content ul a {
        font-family: Tajawal;
        font-size: 12px;
        font-weight: 500;
        line-height: 19px;
        scale: 1;
        text-align: left;
        color: #fff;
        transition: 0.5s;
    }

        footer .upper-footer-content ul a:hover {
            scale: 1.3 !important;
        }

footer .lower-footer-content {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding-top: 35px;
    padding-bottom: 15px;
    position: relative;
    z-index: 5;
}

    footer .lower-footer-content .clients-stats {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 20px;
    }

        footer .lower-footer-content .clients-stats .stat {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 11px;
        }

            footer .lower-footer-content .clients-stats .stat div h4 {
                font-size: 9px;
                color: #fff;
                text-align: left;
                font-weight: 500;
                margin: 0;
            }

            footer .lower-footer-content .clients-stats .stat div h3 {
                font-size: 14px;
                font-weight: 500;
                color: #fff;
                text-align: left;
            }

            footer .lower-footer-content .clients-stats .stat img {
                width: 30px;
                height: 30px;
                object-fit: contain;
                padding: 5px;
                background-color: var(--secondary-color);
                border-radius: 5px;
            }

    footer .lower-footer-content ul {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 5px;
        margin: 0;
    }

        footer .lower-footer-content ul li span {
            width: 1px;
            height: 14px;
            margin: 4px;
            display: flex;
            background-color: #fff;
        }

        footer .lower-footer-content ul li a {
            font-size: 12px;
            font-weight: 500;
            text-align: left;
            color: #fff;
        }

/* Start Clients Section */

.clients-f {
}

footer .client {
    width: 150px;
    display: flex;
    flex-direction: row;
    align-items: center;
}

    footer .client > img {
        width: 90px;
    }

    footer .client a:nth-child(2) img {
        width: 35px;
    }

    footer .client a:nth-child(3) img {
        width: 33px;
    }

    footer .client a {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
    }

        footer .client a img {
            width: 75%;
            height: 80px;
            object-fit: contain;
        }

/* End Clients Section */

/* End Footer Section */

/* Start Copyright Section */

.copy-right {
    background-color: var(--secondary-color);
}

    .copy-right .copy-right-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        min-height: 55px;
    }

        .copy-right .copy-right-content h4 {
            font-size: 12px;
            font-weight: 500;
            text-align: center;
            color: #fff;
            margin: 0;
        }

/* End Copyright Section */

/* Start PageHeader Section*/

.page-header {
    background-color: #f7f7f7;
    margin-bottom: 20px;
}

    .page-header .page-header-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        min-height: 200px;
        background-color: #f7f7f7;
    }

        .page-header .page-header-content img {
            width: 150px;
            height: 150px;
            object-fit: contain;
        }

        .page-header .page-header-content .page-header-info h1 {
            font-size: 35px;
            font-weight: 700;
            line-height: 42px;
            text-align: left;
            color: #000;
            text-align: left;
        }

        .page-header .page-header-content .page-header-info ul {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            gap: 10px;
            justify-content: flex-start;
            direction: rtl;
        }


            .page-header .page-header-content .page-header-info ul li {
                direction: ltr;
                display: flex;
                flex-direction: row-reverse;
                align-items: center;
                gap: 5px;
            }

            .page-header .page-header-content .page-header-info ul li {
                /*direction: ltr;*/
            }

                .page-header .page-header-content .page-header-info ul li a {
                    font-size: 12px;
                    font-weight: 500;
                    text-align: left;
                    color: #26283bcc;
                }

/* End PageHeader Section*/

/* Start support form Section*/

.remove-input-data {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    min-width: 100px;
    height: 45px;
    border-radius: 8px;
    border: none;
    outline: none;
    background-color: #960000;
    color: #fff;
    width: auto;
    padding: 10px;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
    text-align: left !important;
}

.en .select2-container--default .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
    text-align: right !important;
}

.support-form .support-form-content {
    width: 100%;
    /* min-height: 567px;*/
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #d4dde9;
    padding: 25px;
}

    .support-form .support-form-content .data-form {
        /*min-height: 306px;*/
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        gap: 24px;
        direction: ltr;
    }

        .support-form .support-form-content .data-form .inputs {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            width: 100%;
            gap: 20px;
        }

            .support-form .support-form-content .data-form .inputs .input {
                width: 100%;
                position: relative;
                display: flex;
                flex-direction: column;
            }

                .support-form .support-form-content .data-form .inputs .input label {
                    font-size: 16px;
                    font-weight: 500;
                    position: absolute;
                    left: 13px;
                    top: 14px;
                    opacity: 1;
                    user-select: inherit;
                    pointer-events: inherit;
                    transition: 0.3s;
                }

                    .support-form .support-form-content .data-form .inputs .input label span {
                        color: red;
                    }

                .support-form .support-form-content .data-form .inputs .input input {
                    width: 100%;
                    height: 52px;
                    padding: 7px 20px 7px 20px;
                    border: 1px solid #dae2ee;
                    border-radius: 8px;
                    outline: none;
                    text-align: left;
                    font-size: 16px;
                }

                    .support-form
                    .support-form-content
                    .data-form
                    .inputs
                    .input
                    input:focus + label {
                        opacity: 0;
                        user-select: none;
                        pointer-events: none;
                    }

                .support-form .support-form-content .data-form .inputs .input select {
                    width: 100%;
                    height: 52px;
                    padding: 7px 20px 7px 20px;
                    border: 1px solid #dae2ee;
                    border-radius: 8px;
                    direction: ltr;
                    outline: none;
                    font-size: 16px;
                    padding-right: 10px;
                }

                    .support-form
                    .support-form-content
                    .data-form
                    .inputs
                    .input
                    select:focus + label {
                        opacity: 0;
                        user-select: none;
                        pointer-events: none;
                    }

                .support-form .support-form-content .data-form .inputs .input textarea {
                    width: 100%;
                    height: 225px;
                    padding: 7px 20px 7px 20px;
                    border: 1px solid #dae2ee;
                    border-radius: 8px;
                    outline: none;
                    text-align: left;
                    font-size: 16px;
                }

                    .support-form
                    .support-form-content
                    .data-form
                    .inputs
                    .input
                    textarea:focus + label {
                        opacity: 0;
                        user-select: none;
                        pointer-events: none;
                    }

        .support-form .support-form-content .data-form .upload-input {
            width: 100%;
        }

            .support-form .support-form-content .data-form .upload-input label {
                width: 100%;
                text-align: left;
                font-size: 16px;
                font-weight: 500;
                padding: 15px;
            }

            .support-form .support-form-content .data-form .upload-input .upload-here {
                width: 100%;
                border: 3px dotted #d4dde9;
                border-radius: 8px;
                min-height: 200px;
                padding: 33px;
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                text-align: center;
                position: relative;
            }

                .support-form .support-form-content .data-form .upload-input .upload-here span {
                    width: 56px;
                    height: 56px;
                    background-color: #f5f5f5;
                    border-radius: 50%;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    font-size: 30px;
                }

                .support-form .support-form-content .data-form .upload-input .upload-here h2 {
                    font-size: 15px;
                    text-align: center;
                    font-weight: 700;
                    color: #282828;
                }

                .support-form .support-form-content .data-form .upload-input .upload-here h3 {
                    font-size: 11px;
                    font-weight: 500;
                    text-align: center;
                    color: #282828;
                }

        .support-form .support-form-content .data-form .uploaded-files #fileList {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
            padding: 15px;
        }

            .support-form .support-form-content .data-form .uploaded-files #fileList div {
                font-size: 15px;
                background-color: #fff;
                border: 1px solid #d4dde9;
                padding: 5px;
                border-radius: 5px;
                padding-right: 15px;
                padding-left: 15px;
            }

        .support-form .support-form-content .data-form .buttons {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
            direction: rtl
        }

            /*.support-form .support-form-content .data-form .buttons button:nth-child(1) {
                width: 100px;
                height: 46px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                outline: none;
                border: none;
                background-color: var(--primary-color);
                font-weight: 500;
                font-size: 15px;
                border-radius: 7px;
                color: #fff;
            }
*/
            .support-form .support-form-content .data-form .buttons button:nth-child(2) {
                width: 175px;
                height: 46px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                outline: none;
                border: none;
                background-color: #f5f5f5;
                font-weight: 500;
                font-size: 15px;
                border-radius: 7px;
            }

/* End  support form Section*/

/* Start Faqs Section */

.faqs .faqs-content .faqs-search {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
}

    .faqs .faqs-content .faqs-search .open-all-questions {
        width: 195px;
        height: 65px;
        border-radius: 10px;
        outline: none;
        background-color: #fff;
        border: 2px solid #e8eef7;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding: 14px;
    }

        .faqs .faqs-content .faqs-search .open-all-questions span {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            font-size: 15px;
            gap: 5px;
        }

    .faqs .faqs-content .faqs-search .search {
        width: 100%;
        margin-right: 20px;
        display: flex;
        flex-direction: row;
        align-items: center;
    }

        .faqs .faqs-content .faqs-search .search button {
            width: 72px;
            height: 65px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            outline: none;
            border-radius: 0 10px 10px 0;
            background-color: var(--secondary-color);
            outline: none;
            border: none;
        }

        .faqs .faqs-content .faqs-search .search input {
            width: 100%;
            height: 65px;
            border-radius: 0 10px 10px 0;
            text-align: left;
            border: 2px solid #e8eef7;
            padding-left: 15px;
            outline: none;
        }

.faqs .faqs-content .question {
    padding: 24px 28px 24px 28px;
    background-color: #fff;
    border: 2px solid #e8eef7;
    border-radius: 8px;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 0px;
    margin-bottom: 33px;
    transition: 0.5s;
}

    .faqs .faqs-content .question.active {
        gap: 23px;
        padding: 24px 28px 42px 28px;
    }

    .faqs .faqs-content .question .head {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

        .faqs .faqs-content .question .head button {
            outline: none;
            border: none;
            background-color: #f5f7fa;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            width: 41px;
            height: 39px;
            border-radius: 6px;
            color: #986f2f;
            font-size: 16px;
        }

        .faqs .faqs-content .question .head h1 {
            font-size: 20px;
            font-weight: 700;
            cursor: pointer;
            text-align: left;
            color: #26283b;
        }

    .faqs .faqs-content .question .body {
        transition: 0.5s;
        height: 0;
        overflow: hidden;
    }

    .faqs .faqs-content .question.active .body {
        height: fit-content;
    }

    .faqs .faqs-content .question .body p {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        line-height: 19px;
        text-align: left;
        direction: ltr;
    }

    .faqs .faqs-content .question .body label {
        font-size: 15px;
        font-weight: 500;
        line-height: 18px;
        text-align: left;
        color: #000000;
        margin-top: 15px;
        margin-bottom: 19px;
    }

    .faqs .faqs-content .question .body .form-element {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .faqs .faqs-content .question .body textarea {
        width: 100%;
        height: 210px;
        border-radius: 10px;
        border: 1px solid #dae2ee;
        padding: 23px;
        color: #000;
        font-size: 16px;
        text-align: left;
        outline: none;
    }

    .faqs .faqs-content .question .body button {
        width: 143px;
        height: 41px;
        background: var(--primary-color);
        outline: none;
        border: none;
        border-radius: 6px;
        color: #fff;
    }

/* End Faqs Section */

/* Start Rate Content Section */

.rate-content .rate-content-options {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

    .rate-content .rate-content-options > button {
        width: 425px;
        height: 50px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 15px;
        border-radius: 10px;
        padding: 10px 20px 10px 20px;
        background: #f5f5f5;
        outline: none;
        border: none;
        font-size: 14px;
        font-weight: 500;
        text-align: center;
        color: #26283b;
    }

    .rate-content .rate-content-options .options {
        display: flex;
        /* Modefied by Yosef on 24-4-2025 */
        flex-direction: row-reverse;
        align-items: center;
        gap: 25px;
    }

        .rate-content .rate-content-options .options button {
            width: 144px;
            height: 50px;
            border-radius: 10px;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 20px;
            background: #f5f5f5;
            font-size: 14px;
            font-weight: 500;
            text-align: center;
            align-items: center;
            justify-content: center;
            text-align: center;
            border: none;
        }

            .rate-content .rate-content-options .options button i {
                font-size: 20px;
            }

        .rate-content .rate-content-options .options h3 {
            font-size: 16px;
            font-weight: 500;
            text-align: left;
            color: #26283b;
            margin: 0;
        }

.rate-content .date-update h4 {
    font-family: Tajawal;
    font-size: 16px;
    font-weight: 500;
    text-align: right;
    color: #26283b;
}

/* End Rate Content Section */

/* Start laws-and-legistations Section */

.laws-and-legistations .laws-content .laws-search {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 40px;
    background-color: #f5f7fa;
    border: 2px solid #E8EEF7;
    border-radius: 8px;
}

    .laws-and-legistations .laws-content .laws-search a {
        width: 60px;
        height: 65px;
        background: var(--primary-color);
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        border-radius: 0 8px 8px 0;
        outline: none;
        border: none;
    }

    .laws-and-legistations .laws-content .laws-search .custom-date-input {
        width: 15%;
        position: relative;
        direction: ltr;
    }

        .laws-and-legistations .laws-content .laws-search .custom-date-input i {
            position: absolute;
            right: 56px;
            top: 50%;
            transform: translateY(-50%);
        }

        .laws-and-legistations
        .laws-content
        .laws-search
        .custom-date-input
        input:nth-child(2) {
            width: 147px;
            height: 44px;
            border-radius: 8px;
            border: 1px solid #e8eef7;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            direction: ltr;
        }

    .laws-and-legistations .laws-content .laws-search > label {
        font-size: 15px;
        font-weight: 500;
        text-align: left;
        color: #26293e;
    }

    .laws-and-legistations .laws-content .laws-search > input {
        width: 100%;
        height: 65px;
        border-radius: 10px 0 0 10px;
        ;
        outline: none;
        border: none;
        padding: 15px;
        text-align: left;
        font-size: 16px;
        color: #000;
    }

.laws-and-legistations .laws-content .law {
    border: 2px solid #e8eef7;
    min-height: 306px;
    background-color: #fff;
    padding: 24px 28px 24px 28px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 15px;
    border-radius: 8px;
    margin-bottom: 25px;
    justify-content: space-between;
}

    .laws-and-legistations .laws-content .law > img {
        width: 40px;
        height: 40px;
        object-fit: contain;
    }

    .laws-and-legistations .laws-content .law h1 {
        font-size: 17px;
        font-weight: 700;
        text-align: left;
        color: #26283b;
    }

    .laws-and-legistations .laws-content .law h3 {
        font-weight: 500;
        font-size: 13px;
        color: #777777;
        text-align: left;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 4px;
        direction: ltr;
    }

        .laws-and-legistations .laws-content .law h3 span {
            font-weight: 700;
            font-size: 13px;
            color: #777777;
            text-align: left;
        }

    .laws-and-legistations .laws-content .law div {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 15px;
    }

        .laws-and-legistations .laws-content .law div button {
            width: 20%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 6px;
            height: 40px;
            color: #fff;
            outline: none;
            border: none;
        }

        .laws-and-legistations .laws-content .law div a {
            width: 80%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 6px;
            height: 40px;
            color: #fff;
            outline: none;
            border: none;
        }

/* End laws-and-legistations Section */
/* Start Comments Section */

.comments {
    margin-top: 20px;
    margin-bottom: 20px;
}

    .comments .comments-control button {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        border-radius: 4px;
        background: #f5f7fa;
        border: none;
        outline: none;
        height: 80px;
        padding: 10px 29px 10px 29px;
        font-size: 21px;
        font-weight: 500;
        text-align: left;
    }

        .comments .comments-control button i {
            font-size: 14px;
        }

    .comments .comments-form {
        height: 0;
        overflow: hidden;
        transition: 0.5s;
    }

        .comments .comments-form.active {
            height: 100%;
        }

        .comments .comments-form .inputs {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            gap: 20px;
            margin-top: 33px;
        }

            .comments .comments-form .inputs .input {
                width: 100%;
                display: flex;
                flex-direction: column;
                align-items: initial;
                gap: 16px;
            }

                .comments .comments-form .inputs .input label {
                    font-size: 16px;
                    font-weight: 500;
                    text-align: left;
                }

/*                .comments .comments-form .inputs .input input {
                    border: 1px solid #dae2ee;
                    width: 100%;
                    height: 55px;
                    padding: 25px;
                    border-radius: 10px;
                    direction: ltr;
                    outline: none;
                    font-size: 16px;
                    color: #000;
                }*/

                .comments .comments-form .inputs .input textarea {
                    border: 1px solid #dae2ee;
                    width: 100%;
                    height: 190px;
                    padding: 25px;
                    border-radius: 10px;
                    direction: ltr;
                    outline: none;
                    font-size: 16px;
                    color: #000;
                }

        .comments .comments-form button {
            width: 153px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 6px;
            height: 40px;
            color: #fff;
            outline: none;
            border: none;
            margin-top: 30px;
        }

/* End Comments Section */

/* Start services-page Section */

.services-page {
}

    .services-page .services-search {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #e8eef7;
        border-radius: 8px;
        background-color: #fff;
    }

        .services-page .services-search button {
            width: 60px;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 0 8px 8px 0;
            outline: none;
            border: none;
        }

        .services-page .services-search select {
            width: 35%;
            height: 65px;
            direction: ltr;
            border: none;
            outline: none;
            border-left: 1px solid #e8eef7;
            padding-left: 16px;
        }

        .services-page .services-search input {
            width: 60%;
            height: 65px;
            border-radius: 10px 0 0 10px;
            outline: none;
            border: none;
            padding: 15px;
            text-align: left;
            font-size: 16px;
            color: #000;
        }

        .services-page .services-search .select2-container .select2-selection--single {
            width: 100%;
            height: 100%;
            direction: ltr;
            border: none;
            outline: none;
            padding-left: 16px;
            border-radius: 0;
        }

        .services-page .services-search .select2 {
            border: none;
        }

    .services-page .service-image {
        margin-bottom: 50px;
        margin-top: 50px;
    }

        .services-page .service-image img {
            width: 100%;
            height: 450px;
            object-fit: contain;
        }

    .services-page h1 {
        font-family: Tajawal;
        font-size: 32px;
        font-weight: 700;
        text-align: center;
        color: #26283b;
        margin-top: 0px;
    }

    .services-page .services-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;
        margin-bottom: 50px;
    }

        .services-page .services-content a {
            width: 33.33%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            /*margin-bottom: 25px;*/
            margin-top: 25px;
            padding: 15px;
        }

        .services-page .services-content .service {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

            .services-page .services-content .service img {
                margin-bottom: 15px;
                width: 105px;
                height: 80px;
            }

            .services-page .services-content .service h1 {
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: center;
                color: #26283b;
                text-align: center;
            }

        .services-page .services-content button {
            margin-top: 40px;
            width: 165px;
            height: 46px;
            background: var(--primary-color);
            outline: none;
            border: none;
            color: #fff;
            border-radius: 7px;
        }

/* End services-page Section */

/* Start service-cataloge-page Section */

.service-cataloge-page {
}

    .service-cataloge-page .services-cataloge-search {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #e8eef7;
        border-radius: 8px;
        padding: 0;
    }

        .service-cataloge-page .services-cataloge-search > button {
            width: 60px;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 0 8px 8px 0;
            outline: none;
            border: none;
        }

        .service-cataloge-page .services-cataloge-search .sub-services-toggle-btns {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            width: 100%;
        }

            .service-cataloge-page
            .services-cataloge-search
            .sub-services-toggle-btns
            button {
                height: 65px;
                background-color: #fff;
                color: #000;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 700;
                text-align: center;
                width: 100%;
                border: none;
                outline: none;
            }

                .service-cataloge-page
                .services-cataloge-search
                .sub-services-toggle-btns
                button.active {
                    border-radius: 6px 0 0 6px;
                    background: var(--primary-color);
                    color: #fff;
                }

    .service-cataloge-page .sub-services-screens {
    }

        .service-cataloge-page .sub-services-screens .screen {
            display: none;
            align-items: center;
            justify-content: flex-end;
            margin-top: 50px;
            margin-bottom: 70px;
            flex-wrap: wrap;
        }

            .service-cataloge-page .sub-services-screens .screen.active {
                display: flex;
            }

            .service-cataloge-page .sub-services-screens .screen a {
                width: 216px;
            }

                .service-cataloge-page .sub-services-screens .screen a .service {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: space-between;
                    min-height: 194px;
                    padding: 15px;
                }

                    .service-cataloge-page .sub-services-screens .screen a .service img {
                        margin-bottom: 15px;
                    }

                    .service-cataloge-page .sub-services-screens .screen a .service h1 {
                        font-family: Tajawal;
                        font-size: 17px;
                        font-weight: 500;
                        text-align: center;
                        color: #26283b;
                        text-align: center;
                    }

            .service-cataloge-page .sub-services-screens .screen > h1 {
                font-size: 20px;
                text-align: center;
                width: 100%;
            }

/* End service-cataloge-page Section */

/* Start service-details Section */

.service-details .service-details-header {
    margin-top: 20px;
    margin-bottom: 20px;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 20px;
}

    .service-details .service-details-header img {
        width: 76px;
        height: 76px;
        object-fit: contain;
    }

    .service-details .service-details-header h1 {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        text-align: left;
        color: #000;
    }

.service-details .service-details-options {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 25px;
    margin-bottom: 25px;
}

    .service-details .service-details-options .option {
        width: 100%;
    }

        .service-details .service-details-options .option a, .service-details .service-details-options .option div {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 8px;
            height: 58px;
            color: #fff;
            gap: 15px;
            font-family: Tajawal;
            font-size: 15px;
            font-weight: 500;
            text-align: center;
            color: #ffffff;
        }

        .service-details .service-details-options .option img {
            width: 20px;
            height: 20px;
            object-fit: contain;
        }

.service-details .main-image {
    width: 100%;
}

    .service-details .main-image img {
        width: 100%;
        height: 500px;
        object-fit: cover;
        border-radius: 15px;
        margin-bottom: 25px;
    }

.service-details .service-description {
    border: 2px solid #e8eef7;
    background: #ffffff;
    min-height: 207px;
    padding: 24px 28px 24px 28px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 19px;
    border-radius: 8px;
    margin-bottom: 25px;
    text-align: left;
}

    .service-details .service-description h1 {
        font-family: Tajawal;
        font-size: 20px;
        font-weight: 700;
        text-align: left;
        color: #26283b;
    }

    .service-details .service-description p {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        text-align: left;
        padding: 15px;
        color: #26283b;
        direction: ltr;
    }

.service-details .service-details {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

    .service-details .service-details .detail {
        border: 1px solid #dae2ee;
        background: #ffffff;
        border-radius: 10px;
        padding: 25px;
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        gap: 20px;
    }

        .service-details .service-details .detail div h1 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: left;
            color: #000000;
            margin-bottom: 11px;
        }

        .service-details .service-details .detail div h2 {
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            text-align: left;
            color: #26283b;
        }

        .service-details .service-details .detail img {
            width: 72px;
            height: 72px;
            object-fit: contain;
        }

        .service-details .service-details .detail div ul {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 5px;
        }

            .service-details .service-details .detail div ul li {
                direction: ltr;
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: left;
                color: #26283b;
            }

.service-details .service-steps {
    margin-top: 0;
    margin-bottom: 25px;
    border: 1px solid #e8edf4;
    border-radius: 10px;
    background: #faf9f8;
    padding: 35px;
}

    .service-details .service-steps > h1 {
        font-family: Tajawal;
        font-size: 18px;
        font-weight: 700;
        text-align: left;
        margin-bottom: 30px;
    }

    .service-details .service-steps .step {
        min-height: 101px;
        background: #ffffff;
        border: 1px solid #e8edf4;
        padding: 25px;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 15px;
        border-radius: 6px;
        margin-bottom: 10px;
    }

        .service-details .service-steps .step span {
            width: 60px;
            height: 60px;
            font-family: Tajawal;
            font-size: 27px;
            font-weight: 500;
            text-align: center;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 50%;
            color: #fff;
            margin-left: -43px;
        }

        .service-details .service-steps .step h2 {
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            text-align: left;
            color: #26283b;
            margin: 0;
            direction: ltr;
            width: 80%;
        }

/* End service-details Section */

/* Start service-apply Section */

.service-apply {
}

    .service-apply .service-details-header {
        margin-top: 25px;
        margin-bottom: 25px;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: flex-start;
        text-align: left;
        gap: 15px;
    }

        .service-apply .service-details-header img {
            width: 76px;
            height: 76px;
            object-fit: contain;
        }

        .service-apply .service-details-header div h1 {
            font-family: Tajawal;
            font-size: 26px;
            font-weight: 500;
            text-align: left;
            color: #26283b;
        }

        .service-apply .service-details-header div h2 {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            text-align: left;
            color: #000000;
            direction: ltr;
        }

    .service-apply .service-apply-options {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
        margin-top: 25px;
        margin-bottom: 25px;
    }

        .service-apply .service-apply-options .option {
            width: 100%;
        }

            .service-apply .service-apply-options .option a, .service-apply .service-apply-options .option div {
                width: 100%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                background: var(--primary-color);
                border-radius: 8px;
                height: 58px;
                color: #fff;
                gap: 15px;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 500;
                text-align: center;
                color: #ffffff;
            }

                .service-apply .service-apply-options .option a img {
                    width: 20px;
                    height: 20px;
                    object-fit: contain;
                }

    .service-apply .apply-service-form {
        border: 1px solid #d4dde9;
        background: #ffffff;
        border-radius: 10px;
        padding: 25px 40px;
        margin-bottom: 70px;
    }

        .service-apply .apply-service-form h4 {
            font-family: Tajawal;
            font-size: 13px;
            font-weight: 500;
            text-align: right;
            margin-bottom: 15px;
        }

        .service-apply .apply-service-form .form-element {
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 10px;
        }

        .service-apply .apply-service-form .input-auth {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: flex-start;
            gap: 15px;
            justify-content: flex-end;
        }

            .service-apply .apply-service-form .input-auth .input {
                text-align: left;
                width: 100%;
            }

                .service-apply .apply-service-form .input-auth .input > label {
                    font-family: Tajawal;
                    font-size: 16.79px;
                    font-weight: 700;
                    text-align: left;
                    color: #26283b;
                }

                .service-apply .apply-service-form .input-auth .input > div {
                    display: flex;
                    flex-direction: row-reverse;
                    align-items: center;
                    gap: 15px;
                    margin-top: 10px;
                    justify-content: space-between;
                }

                .service-apply .apply-service-form .input-auth .input div > input {
                    width: 100%;
                    height: 52px;
                    border: 1.46px solid #dae2ee;
                    outline: none;
                    color: #000;
                    font-size: 16px;
                    border-radius: 8px;
                    padding: 7px;
                    direction: ltr;
                }

                .service-apply .apply-service-form .input-auth .input > div > button {
                    width: 200px;
                    height: 52px;
                    border-radius: 5px;
                    text-align: center;
                    outline: none;
                    border: none;
                    color: #fff;
                    display: flex;
                    flex-direction: row-reverse;
                    align-items: center;
                    justify-content: center;
                    gap: 10px;
                    background: var(--primary-color);
                }

        .service-apply .apply-service-form > span {
            width: 48px;
            height: 48px;
            background: #f5f7fa;
            border-radius: 50%;
            font-family: Tajawal;
            font-size: 16.79px;
            font-weight: 500;
            text-align: center;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            color: #26283b;
        }

        .service-apply .apply-service-form .inputs {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: flex-start;
            gap: 10px;
            margin-top: 25px;
            margin-bottom: 25px;
        }

            .service-apply .apply-service-form .inputs label {
                font-family: Tajawal;
                font-size: 16.79px;
                font-weight: 700;
                text-align: left;
                color: #26283b;
                width: 100%;
                margin-bottom: 15px;
            }

            .service-apply .apply-service-form .inputs .input > div {
                width: 100%;
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 15px;
            }

            .service-apply .apply-service-form .inputs .normal-input > div {
                width: 100%;
                display: flex;
                flex-direction: row-reverse;
                align-items: center;
                gap: 15px;
                margin-bottom: 19px;
            }

                .service-apply .apply-service-form .inputs .normal-input > div input {
                    width: 100%;
                    height: 52px;
                    border: 1.46px solid #dae2ee;
                    outline: none;
                    color: #000;
                    font-size: 16px;
                    border-radius: 8px;
                    padding: 7px;
                    direction: ltr;
                }

            .service-apply .apply-service-form .inputs .normal-input {
                width: 100%;
            }

.RadComboBox_Default .rcbInner {
    border-color: #b3b3b3;
    color: #333;
    background-color: #fff;
    border-radius: 3px;
    width: 100%;
    border: none !important;
    outline: none !important;
}

.RadComboBox .rcbInput {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    height: 1.42857143em !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    color: inherit !important;
    background: 0 !important;
    font: inherit !important;
    display: inline-block !important;
    -webkit-appearance: none !important;
    overflow: hidden !important;
    -o-text-overflow: ellipsis !important;
    -ms-text-overflow: ellipsis !important;
    text-overflow: ellipsis !important;
    width: 100% !important;
    height: 52px !important;
    border: 0 !important;
    outline: none !important;
    color: #000 !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    padding: 7px !important;
    direction: ltr !important;
}

.service-apply .apply-service-form .inputs > div > input {
    width: 100%;
    height: 52px;
    border: 1.46px solid #dae2ee;
    outline: none;
    color: #000;
    font-size: 16px;
    border-radius: 8px;
    padding: 7px;
    direction: ltr;
}

.service-apply .apply-service-form .input-auth .input > label {
    font-family: Tajawal;
    font-size: 16.79px;
    font-weight: 700;
    text-align: left;
    color: #26283b;
}

.service-apply .apply-service-form .input-auth .normal-input > label {
    font-family: Tajawal;
    font-size: 16.79px;
    font-weight: 700;
    text-align: left;
    color: #26283b;
}

.service-apply .apply-service-form .input-auth .input h3 {
    font-family: Tajawal;
    font-size: 13px;
    font-weight: 500;
    text-align: right;
    margin-bottom: 15px;
    text-align: left;
}

.service-apply .apply-service-form .input-auth .input h4 {
    margin: 0;
    display: flex;
    flex-direction: row-reverse;
    gap: 5px;
}

    .service-apply .apply-service-form .input-auth .input h4 > button {
        width: inherit;
        height: inherit;
        background-color: transparent;
        color: #000;
    }

.service-apply .apply-service-form .agreament {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: 18px;
    gap: 10px;
}

    .service-apply .apply-service-form .agreament label {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 5px;
        font-family: Tajawal;
        font-size: 13px;
        font-weight: 500;
        text-align: left;
    }

        .service-apply .apply-service-form .agreament label a {
            font-family: Tajawal;
            font-size: 13px;
            font-weight: 500;
            text-align: left;
            color: #737373;
        }

    .service-apply .apply-service-form .agreament input {
    }

.service-apply .apply-service-form .upload-input {
    width: 100%;
}

    .service-apply .apply-service-form .upload-input > label {
        width: 100%;
        text-align: left;
        font-size: 16px;
        font-weight: 500;
        padding: 15px;
    }

    .service-apply .apply-service-form .upload-input .upload-here {
        width: 100%;
        border: 3px dotted #d4dde9;
        border-radius: 8px;
        min-height: 200px;
        padding: 33px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        position: relative;
    }

        .service-apply .apply-service-form .upload-input .upload-here > span {
            width: 56px;
            height: 56px;
            background-color: #f5f5f5;
            border-radius: 50%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            font-size: 30px;
        }

        .service-apply .apply-service-form .upload-input .upload-here h2 {
            font-size: 15px;
            text-align: center;
            font-weight: 700;
            color: #282828;
        }

        .service-apply .apply-service-form .upload-input .upload-here h3 {
            font-size: 11px;
            font-weight: 500;
            text-align: center;
            color: #282828;
        }

.service-apply .apply-service-form .uploaded-files #fileList {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
    padding: 15px;
}

    .service-apply .apply-service-form .uploaded-files #fileList div {
        font-size: 15px;
        background-color: #fff;
        border: 1px solid #d4dde9;
        padding: 5px;
        border-radius: 5px;
        padding-right: 15px;
        padding-left: 15px;
    }

.service-apply .apply-service-form .buttons {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
    width: 100%;
}

    .service-apply .apply-service-form .buttons > button:nth-child(1) {
        width: 175px;
        height: 46px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        background-color: var(--primary-color);
        font-weight: 500;
        font-size: 15px;
        border-radius: 7px;
        color: #fff;
    }

    .service-apply .apply-service-form .buttons > button:nth-child(2) {
        width: 175px;
        height: 46px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        background-color: #f5f5f5;
        font-weight: 500;
        font-size: 15px;
        border-radius: 7px;
    }

/* End service-apply Section */

/* Start contact-us-page Section */

/* Modefied by Yosef on 29-4-2025 */
.contact-us-page .police-stations .stations .station .locations-popup .direction img {
    width: 10%;
    height: 10%;
    margin-left: 21px;
}

.contact-us-page {
}

    .contact-us-page .contact-options {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        margin-bottom: 80px;
        direction: ltr;
    }

        .contact-us-page .contact-options .option {
            min-height: 182px;
            width: 241px;
            border: 1px solid #d4dde9;
            box-shadow: 0px 0px 14px 0px #00000008;
            border-radius: 8px;
            padding: 13px 27px;
            margin: 15px 8px;
        }

            .contact-us-page .contact-options .option a {
                height: 182px;
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                justify-content: center;
            }

            .contact-us-page .contact-options .option img {
                width: 72px;
                height: 72px;
                object-fit: contain;
                margin-bottom: 26px;
            }

            .contact-us-page .contact-options .option h3 {
                font-family: Tajawal;
                font-size: 12px;
                font-weight: 500;
                text-align: left;
                color: #26283b;
                width: 100%;
            }

            .contact-us-page .contact-options .option h2 {
                font-family: Tajawal;
                font-size: 19px;
                font-weight: 700;
                text-align: left;
                color: #26283b;
                width: 100%;
            }

    .contact-us-page .contact-page-map {
    }

        .contact-us-page .contact-page-map .search {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 15px;
            width: 100%;
            position: relative;
            margin-bottom: 40px;
        }

            .contact-us-page .contact-page-map .search button {
                background-color: transparent;
                outline: none;
                border: none;
                filter: invert(1);
                position: absolute;
                right: 12px;
            }

            .contact-us-page .contact-page-map .search input {
                height: 48px;
                border-radius: 58px;
                border: 1px solid #d4dde9;
                width: 100%;
                text-align: left;
                padding-right: 20px;
                padding-left: 20px;
            }

    .contact-us-page .police-stations {
    }

        .contact-us-page .police-stations h1 {
            font-family: Tajawal;
            font-size: 22px;
            font-weight: 700;
            text-align: left;
            color: #26283b;
            margin-bottom: 40px;
        }

        .contact-us-page .police-stations h3 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 600;
            text-align: left;
            color: #26283b;
            /* Modefied by Yosef on 28-4-2025 */
            /*margin-bottom: 40px;*/
            text-decoration: underline;
            text-underline-position: under;
            text-align: left;
        }

        .contact-us-page .police-stations .stations {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
            direction: ltr;
            /* max-height: 550px !important;
            overflow-y: scroll;*/
            margin-bottom: 3%;
            border-bottom: 1px solid #E9EDF3;
        }



            .contact-us-page .police-stations .stations .station h2 {
                /* Modefied by Yosef on 28-4-2025 */
                background-color: rgb(255, 255, 255);
                padding: 10px 10px;
                margin: 10px;
                color: #000;
            }

                .contact-us-page .police-stations .stations .station h2:hover {
                    border-radius: 5px;
                    box-shadow: 2px 2px 1px grey;
                }

            .contact-us-page .police-stations .stations .station {
                margin-bottom: 60px;
            }

                .contact-us-page .police-stations .stations .station > div {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: space-around;
                    width: 100%;
                }

                    .contact-us-page .police-stations .stations .station > div > a {
                    }

                    .contact-us-page .police-stations .stations .station > div > button {
                        background-color: transparent;
                        outline: none;
                        border: none;
                    }

                .contact-us-page .police-stations .stations .station .locations-popup {
                    display: none;
                    position: absolute;
                    background-color: #fff;
                    width: 350px;
                    z-index: 2;
                    padding: 15px;
                    border-radius: 10px;
                    border: 1px solid #00000017;
                    transition: 0.6s;
                }

                    .contact-us-page .police-stations .stations .station .locations-popup.active {
                        /*                        top: 50%;
                        left: 40%;
                        transform: translate(-50%, -50%);*/
                        display: block !important;
                    }

                    .contact-us-page .police-stations .stations .station .locations-popup .header {
                        /* Modefied by Yosef on 28-4-2025 */
                        /*border-bottom: 1px solid #e9edf3;*/
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: space-between;
                        font-weight: bold !important;
                    }
                    /* Modefied by Yosef on 28-4-2025 */
                    .contact-us-page .police-stations .stations .station .locations-popup ul {
                        direction: rtl;
                    }

                    .contact-us-page .police-stations .stations .station .locations-popup .all-services i {
                        color: #dbc4ab;
                    }

                    .contact-us-page .police-stations .stations .station .locations-popup .header button {
                        background-color: transparent;
                        outline: none;
                        border: none;
                        font-size: 24px;
                    }

                    .contact-us-page
                    .police-stations
                    .stations
                    .station
                    .locations-popup
                    .header
                    h3 {
                        font-family: Tajawal;
                        font-size: 21px;
                        font-weight: bold !important;
                        text-align: left;
                        color: #000 !important;
                    }

                    .contact-us-page .police-stations .stations .station .locations-popup ul li {
                        width: 100%;
                        border-bottom: 1px solid #e9edf3;
                        height: 60px;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: flex-end;
                    }

                        .contact-us-page .police-stations .stations .station .locations-popup ul li:nth-child(3) a {
                            color: black !important;
                            font-weight: bold !important;
                        }

                        .contact-us-page .police-stations .stations .station .locations-popup ul li a {
                            font-family: Tajawal;
                            font-size: 17.99px;
                            font-weight: 500;
                            text-align: left;
                            color: #26283b;
                            display: flex;
                            flex-direction: row-reverse;
                            align-items: center;
                            gap: 10px;
                        }


                    .contact-us-page .police-stations .stations .station .locations-popup h4 {
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: flex-end;
                    }

                        .contact-us-page .police-stations .stations .station .locations-popup h4 span {
                            font-family: Tajawal;
                            font-size: 16px;
                            font-weight: 500;
                            text-align: left;
                            color: #26283b;
                        }

                        .contact-us-page .police-stations .stations .station .locations-popup h4 i {
                            width: 36px;
                            height: 36px;
                            background: #f5f7fa;
                            display: flex;
                            flex-direction: row;
                            align-items: center;
                            justify-content: center;
                            border-radius: 50%;
                        }

                    .contact-us-page
                    .police-stations
                    .stations
                    .station
                    .locations-popup
                    .all-locations {
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        flex-wrap: wrap;
                        gap: 4px;
                        justify-content: flex-end;
                    }

                        .contact-us-page
                        .police-stations
                        .stations
                        .station
                        .locations-popup
                        .all-locations
                        span {
                            padding: 5px;
                            display: flex;
                            flex-direction: row;
                            align-items: center;
                            justify-content: center;
                            border-radius: 50px;
                            background-color: #eee;
                            width: fit-content;
                            padding-right: 15px;
                            padding-left: 15px;
                        }

    .contact-us-page .contact-us-footer {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

        /*        .contact-us-page .contact-us-footer .left {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
        }*/



        .contact-us-page .contact-us-footer .left h2 {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            text-align: left;
            color: #1c1e2e;
        }

        /*        .contact-us-page .contact-us-footer .right {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 8px;
        }*/

        .contact-us-page .contact-us-footer .right a {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            width: 48px;
            height: 48px;
            border-radius: 10px;
            background: var(--primary-color);
            color: #fff;
            font-size: 29px;
        }

        .contact-us-page .contact-us-footer .right img {
        }

        .contact-us-page .contact-us-footer .right h2 {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            text-align: left;
            color: #1c1e2e;
            margin-right: 17px;
        }

/* End contact-us-page Section */

/* Start News Page Styles */

.news-page .news-categories-toggle-btns {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    border-radius: 8px;
    overflow: hidden;
}

    .news-page .news-categories-toggle-btns .search button {
        background-color: transparent;
        outline: none;
        border: none;
        width: 72px;
        height: 63px;
        background: var(--primary-color);
        border-radius: 0 8px 8px 0;
    }

    .news-page .news-categories-toggle-btns .btns {
        width: 100%;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        height: 63px;
        border: 2px solid #e8eef7;
        border-radius: 8px;
    }

        .news-page .news-categories-toggle-btns .btns button {
            width: 100%;
            height: 63px;
            border: none;
            outline: none;
            background-color: transparent;
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: center;
            color: #000000;
        }

            .news-page .news-categories-toggle-btns .btns button.active {
                border-radius: 8px 0 0 8px;
                background: var(--primary-color);
                color: #fff;
            }

.news-page .news-dates-toggle-btns {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 63px;
    border: 2px solid #e8eef7;
    border-radius: 8px;
    margin-top: 25px;
    margin-bottom: 28px;
    border-radius: 8px;
    overflow: hidden;
}

    .news-page .news-dates-toggle-btns .years select {
        width: 107px;
        height: 44px;
        border: 1px solid #e6ecf5;
        padding: 8px;
        margin-right: 15px;
        direction: ltr;
        border-radius: 5px;
    }

    .news-page .news-dates-toggle-btns .months {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        width: 100%;
    }

        .news-page .news-dates-toggle-btns .months button {
            width: 100%;
            height: 63px;
            border: none;
            outline: none;
            background-color: transparent;
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: center;
            color: #000000;
        }

            .news-page .news-dates-toggle-btns .months button.active {
                background: var(--primary-color);
                color: #fff;
            }

.news-page .news-item {
    width: 364px;
    min-height: 465px;
    position: relative;
    margin-right: 40px;
    margin-left: 27px;
    margin-bottom: 25px;
    border-radius: 20px;
}

    .news-page .news-item img {
        width: 100%;
        height: 343px;
        border-radius: 10px;
        object-fit: contain;
    }

    .news-page .news-item .text {
        width: 90%;
        background-color: #fff;
        position: absolute;
        bottom: 15px;
        right: 50%;
        transform: translateX(50%);
        border-radius: 10px;
        padding: 26px;
        min-height: 170px;
        text-align: left;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
        opacity: 0.9;
    }

        .news-page .news-item .text h4 {
            font-weight: 500;
            font-size: 13px;
            color: #808080;
            direction: ltr;
            text-align: left;
        }

        .news-page .news-item .text p {
            font-weight: 700;
            font-size: 16px;
            color: #26283b;
        }

        .news-page .news-item .text a {
            font-weight: 500;
            font-size: 13px;
            color: #063579;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
        }

/* End News Page Styles */

/* Start news-inner-page Styles */

.news-inner-page .main-img img {
    width: 100%;
    object-fit: contain;
    height: 590px;
    border-radius: 15px;
}

.news-inner-page .news-text {
    margin: 30px;
    /* Modefied by Yosef on 24-4-2025 */
    margin-top: 15px;
    background-color: #fff;
    position: relative;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #eaeaea;
}

    .news-inner-page .news-text .header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 20px;
    }

        .news-inner-page .news-text .header .options {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 20px;
        }

            .news-inner-page .news-text .header .options a {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 12px;
                width: 130px;
                height: 50px;
                border-radius: 8px;
                padding: 20px;
                background: #f5f7fa;
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: center;
                color: #2c2c2c;
            }

                .news-inner-page .news-text .header .options a i {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    height: 32px;
                    width: 32px;
                    padding: 15px;
                    background: var(--primary-color);
                    border-radius: 8px;
                    font-size: 20px;
                    color: #fff;
                }

        .news-inner-page .news-text .header h3 {
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            text-align: left;
            color: #808080;
            direction: ltr;
        }

    .news-inner-page .news-text h2 {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        color: #26283b;
        text-align: left;
        direction: ltr;
        margin-bottom: 40px;
    }

    .news-inner-page .news-text p {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        color: #26283b;
        text-align: justify;
        text-align: left;
        direction: ltr;
        margin-bottom: 43px;
    }

/* End news-inner-page Styles */

/* Start publications-page Styles */

.publications-page {
}

    .publications-page .header {
    }

        /*.publications-page .header .search {
            display: flex;
            flex-direction: row;
            align-items: center;*/
        /* justify-content: space-between;*/
        /*margin-bottom: 40px;
            background-color: #f5f7fa;
            border: 2px solid #e8eef7;
            border-radius: 8px;
        }*/
        /*
            .publications-page .header .search button {
                width: 60px;
                height: 65px;
                background: var(--primary-color);
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                border-radius: 0 8px 8px 0;
                outline: none;
                border: none;
            }*/

        .publications-page .header .search .custom-date-input {
            width: 15%;
            position: relative;
            direction: ltr;
        }

            .publications-page .header .search .custom-date-input i {
                position: absolute;
                right: 56px;
                top: 50%;
                transform: translateY(-50%);
            }

            .publications-page .header .search .custom-date-input input:nth-child(2) {
                width: 147px;
                height: 44px;
                border-radius: 8px;
                border: 1px solid #e8eef7;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                direction: ltr;
            }

        .publications-page .header .search > label {
            font-size: 15px;
            font-weight: 500;
            text-align: left;
            color: #26293e;
        }

    /*.publications-page .header .search > input {
                width: 60%;
                height: 65px;
                border-radius: 10px 0 0 10px;
                outline: none;
                border: none;
                padding: 15px;
                text-align: left;
                font-size: 16px;
                color: #000;
            }*/

    .publications-page .publication {
        height: 250px;
        margin-bottom: 35px;
        position: relative;
        border-radius: 14px;
    }

        .publications-page .publication a {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            height: 100%;
            justify-content: flex-end;
            padding: 7px;
        }

        .publications-page .publication img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            position: absolute;
            inset: 0;
            border-radius: 10px;
        }

        .publications-page .publication h1 {
            position: relative;
            font-family: Tajawal;
            font-size: 22px;
            font-weight: 500;
            text-align: center;
            color: #fff;
            padding-bottom: 17px;
        }

/* End publications-page Styles */

/* Start publication-sub-page Section */

.publication-sub-page {
}

    .publication-sub-page .publication-dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        height: 63px;
        border: 2px solid #e8eef7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
    }

        .publication-sub-page .publication-dates-toggle-btns .years select {
            width: 107px;
            height: 44px;
            border: 1px solid #e6ecf5;
            padding: 8px;
            margin-right: 15px;
            direction: ltr;
            border-radius: 5px;
        }

        .publication-sub-page .publication-dates-toggle-btns .months {
            display: flex;
            flex-direction: row;
            align-items: center;
            width: 100%;
        }

            .publication-sub-page .publication-dates-toggle-btns .months button {
                width: 100%;
                height: 63px;
                border: none;
                outline: none;
                background-color: transparent;
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: center;
                color: #000000;
            }

                .publication-sub-page .publication-dates-toggle-btns .months button.active {
                    background: var(--primary-color);
                    color: #fff;
                }

    .publication-sub-page .publication-item {
        width: 364px;
        min-height: 610px;
        position: relative;
        margin-right: 40px;
        margin-left: 27px;
    }

        .publication-sub-page .publication-item img {
            width: 100%;
            height: 500px;
            border-radius: 10px;
            object-fit: cover;
        }

        .publication-sub-page .publication-item .text {
            width: 90%;
            background-color: #fff;
            position: absolute;
            bottom: 34px;
            right: 50%;
            transform: translateX(50%);
            border-radius: 10px;
            padding: 26px;
            min-height: 170px;
            text-align: left;
            justify-content: space-between;
            display: flex;
            flex-direction: column;
        }

/*            .publication-sub-page .publication-item .text h4 {
                font-weight: 500;
                font-size: 13px;
                color: #808080;
            }*/

            .publication-sub-page .publication-item .text p {
                font-weight: 700;
                font-size: 16px;
                color: #26283b;
            }

            .publication-sub-page .publication-item .text a {
                font-weight: 500;
                font-size: 13px;
                color: #063579;
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 15px;
            }

/* End publication-sub-page Section */

/* Start Events Section */

.events-page .events-dates-toggle-btns {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 63px;
    border: 2px solid #e8eef7;
    border-radius: 8px;
    margin-top: 25px;
    margin-bottom: 28px;
    border-radius: 8px;
    overflow: hidden;
}

    .events-page .events-dates-toggle-btns .years select {
        width: 107px;
        height: 44px;
        border: 1px solid #e6ecf5;
        padding: 8px;
        margin-right: 15px;
        direction: ltr;
        border-radius: 5px;
    }

    .events-page .events-dates-toggle-btns .months {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
    }

        .events-page .events-dates-toggle-btns .months button {
            width: 100%;
            height: 63px;
            border: none;
            outline: none;
            background-color: transparent;
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: center;
            color: #000000;
        }

            .events-page .events-dates-toggle-btns .months button.active {
                background: var(--primary-color);
                color: #fff;
            }

.events-page .event-item {
    width: 364px;
    min-height: 400px;
    position: relative;
    margin-right: 40px;
    margin-left: 27px;
}

    .events-page .event-item img {
        width: 100%;
        height: 300px;
        border-radius: 10px;
        object-fit: cover;
    }

    .events-page .event-item .text {
        width: 90%;
        background-color: #fff;
        position: absolute;
        bottom: 34px;
        right: 50%;
        transform: translateX(50%);
        border-radius: 10px;
        padding: 26px;
        min-height: 170px;
        text-align: left;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

        .events-page .event-item .text h4 {
            font-weight: 500;
            font-size: 14px;
            /*color: #fff;
            height: 40px;
            width: 130px;*/
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            /*background: var(--primary-color);*/
            border-radius: 5px;
            margin-bottom: 15px;
            direction: ltr;
        }

        .events-page .event-item .text h1 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: left;
            color: #26283b;
        }

        .events-page .event-item .text h3 {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            text-align: left;
        }

            .events-page .event-item .text h3 i {
                color: var(--primary-color);
            }

        .events-page .event-item .text a {
            font-weight: 500;
            font-size: 13px;
            color: #063579;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
            width: 100%;
        }

/* End Events Section */

/* Start Events Inner Section */

.event-inner-page .main-img img {
    width: 100%;
    object-fit: cover;
    height: 590px;
    border-radius: 15px;
}

.event-inner-page .event-text {
    margin: 30px;
    margin-top: -60px;
    background-color: #fff;
    position: relative;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #eaeaea;
}

    .event-inner-page .event-text .header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 20px;
    }

        .event-inner-page .event-text .header .options {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 20px;
        }

            .event-inner-page .event-text .header .options a {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 12px;
                width: 130px;
                height: 50px;
                border-radius: 8px;
                padding: 20px;
                background: #f5f7fa;
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: center;
                color: #2c2c2c;
            }

                .event-inner-page .event-text .header .options a i {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    height: 32px;
                    width: 32px;
                    padding: 15px;
                    background: var(--primary-color);
                    border-radius: 8px;
                    font-size: 20px;
                    color: #fff;
                }

        .event-inner-page .event-text .header .date-loc {
            display: block;
            /*flex-direction: row;*/
            align-items: center;
            gap: 21px;
        }

            .event-inner-page .event-text .header .date-loc h3 {
                /*display: flex;*/
                flex-direction: row;
                align-items: center;
                gap: 5px;
                font-family: Tajawal;
                font-size: 18px;
                font-weight: 500;
                text-align: left;
            }

                .event-inner-page .event-text .header .date-loc h3 i {
                    color: var(--primary-color);
                }

            .event-inner-page .event-text .header .date-loc h4 {
                font-weight: 500;
                font-size: 15px;
                /* color: #fff;
                height: 40px;
                width: 130px;*/
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                /*background: var(--primary-color);*/
                border-radius: 5px;
                margin-bottom: 15px;
                direction: ltr;
            }

    .event-inner-page .event-text h2 {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        color: #26283b;
        text-align: left;
        direction: ltr;
        margin-bottom: 40px;
    }

    .event-inner-page .event-text p {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        color: #26283b;
        text-align: justify;
        text-align: left;
        direction: ltr;
        margin-bottom: 43px;
    }

/* End Events Inner Section */

/* Start Media Section */

.media-page .media-item {
    width: 364px;
    min-height: 400px;
    position: relative;
    margin-right: 0;
    margin-left: 0;
    width: 100%;
}
.media-page .audio-media-item {
    text-align: center;
    padding: 20px;
    border: 2px solid rgb(188 183 169);
    margin-bottom: 10px;
    border-radius: 10px;
    color: rgb(121 112 84);
    cursor: pointer;
    height: 275px;
}
    .media-page .media-item img {
        width: 100%;
        height: 300px;
        border-radius: 10px;
        object-fit: cover;
        cursor: pointer;
    }

    .media-page .media-item .text {
        width: 90%;
        background-color: #fff;
        position: absolute;
        bottom: 34px;
        right: 50%;
        transform: translateX(50%);
        border-radius: 10px;
        padding: 26px;
        min-height: 170px;
        text-align: left;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

        .media-page .media-item .text h1 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: left;
            color: #26283b;
        }

    .media-page .media-item .item-popup {
        position: fixed;
        inset: 0;
        width: 100%;
        height: 100%;
        background-color: #000000a8;
        z-index: 50;
        display: none;
        z-index: 60000;
    }

/*        .media-page .media-item .item-popup .close-pop-up {
            position: absolute;
            z-index: 2;
            left: 35px;
            top: 35px;
            background-color: transparent;
            outline: none;
            border: none;
            color: #fff;
            font-size: 36px;
        }*/

        .media-page .media-item .item-popup .item-content {
            position: absolute;
            width: 100%;
            height: 100%;
            inset: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

            .media-page .media-item .item-popup .item-content .sound {
                width: 50%;
                height: 50%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                background-color: #fff;
                border-radius: 17px;
            }

                .media-page .media-item .item-popup .item-content .sound audio {
                    width: 80%;
                }

            .media-page .media-item .item-popup .item-content .video {
                width: 90%;
                height: 90%;
            }

                .media-page .media-item .item-popup .item-content .video video {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    border-radius: 15px;
                }

                .media-page .media-item .item-popup .item-content .video iframe {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    border-radius: 15px;
                }

            .media-page .media-item .item-popup .item-content .image {
                width: 90%;
                height: 90%;
            }

                .media-page .media-item .item-popup .item-content .image img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    border-radius: 15px;
                }

/* End Media Section */

/* Start Blog Page Section  */

.blog-page .blog-item {
    width: 364px;
    min-height: 465px;
    position: relative;
    margin-right: 40px;
    margin-left: 27px;
}

    .blog-page .blog-item img {
        width: 100%;
        height: 343px;
        border-radius: 10px;
        object-fit: cover;
    }

    .blog-page .blog-item .text {
        width: 90%;
        background-color: #fff;
        position: absolute;
        bottom: 34px;
        right: 50%;
        transform: translateX(50%);
        border-radius: 10px;
        padding: 26px;
        min-height: 170px;
        text-align: left;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
    }

        .blog-page .blog-item .text h4 {
            font-weight: 500;
            font-size: 13px;
            color: #808080;
        }

        .blog-page .blog-item .text h1 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: left;
            color: #26283b;
        }

        .blog-page .blog-item .text p {
            font-weight: 700;
            font-size: 16px;
            color: #26283b;
        }

        .blog-page .blog-item .text a {
            font-weight: 500;
            font-size: 13px;
            color: #063579;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
        }

/* End Blog Page Section */

/* Start advice-page Section */

.advice-page .advice-header,
.questionnaires-page .questionnaires-header {
    margin-bottom: 50px;
    margin-top: 50px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

    .advice-page .advice-header .search,
    .questionnaires-page .questionnaires-header .search {
        position: relative;
        display: flex;
        flex-direction: row;
        align-items: center;
    }

        .advice-page .advice-header .search button,
        .questionnaires-page .questionnaires-header .search button {
            width: 72px;
            height: 65px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            outline: none;
            border: none;
            border-radius: 0 8px 8px 0;
        }

        .advice-page .advice-header .search input,
        .questionnaires-page .questionnaires-header .search input {
            width: 420px;
            height: 65px;
            border-radius: 8px 0 0 8px;
            border: 1px solid #d4dde9;
            padding-right: 20px;
            padding-left: 20px;
            direction: ltr;
        }

    .advice-page .advice-header .btns,
    .questionnaires-page .questionnaires-header .btns {
        height: 65px;
        border: 1px solid #d4dde9;
        border-radius: 8px;
        overflow: hidden;
        display: flex;
        flex-direction: row;
    }

        .advice-page .advice-header .btns button,
        .questionnaires-page .questionnaires-header .btns button {
            width: 200px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            color: #000;
            font-family: Tajawal;
            font-size: 15px;
            font-weight: 700;
            text-align: center;
            background-color: transparent;
            outline: none;
            border: none;
        }

            .advice-page .advice-header .btns button.active,
            .questionnaires-page .questionnaires-header .btns button.activ {
                color: #fff;
                background: var(--primary-color);
            }

.advice-page .advice,
.questionnaires-page .questionnair {
    background: #faf9f8;
    border-radius: 10px;
    padding: 35px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 32px;
    margin-bottom: 30px;
    min-height: 320px;
    justify-content: space-between;
}

    .advice-page .advice h1,
    .questionnaires-page .questionnair h1 {
        font-family: Tajawal;
        font-size: 20px;
        font-weight: 700;
        text-align: left;
        color: #141414;
    }

    .advice-page .advice h3,
    .questionnaires-page .questionnair h3 {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 5px;
    }

        .advice-page .advice h3 span,
        .questionnaires-page .questionnair h3 span {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: left;
            color: var(--primary-color);
        }

        .advice-page .advice h3 i,
        .questionnaires-page .questionnair h3 i {
            color: var(--primary-color);
        }

    .advice-page .advice .options,
    .questionnaires-page .questionnair .options {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

        .advice-page .advice .options button,
        .questionnaires-page .questionnair .options button {
            height: 40px;
            width: 135px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            color: #fff;
            gap: 10px;
            border-radius: 8px;
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            outline: none;
            border: none;
            background-color: var(--primary-color);
        }

        .advice-page .advice .options a,
        .questionnaires-page .questionnair .options a {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 10px;
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            color: var(--primary-color);
        }

/* End advice-page Section */

/* Start advice-inner-page Section */

.advice-inner-page {
}

    .advice-inner-page .header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 32px;
    }

        .advice-inner-page .header button {
            height: 40px;
            width: 135px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            color: #fff;
            gap: 10px;
            border-radius: 8px;
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            outline: none;
            border: none;
            background-color: var(--primary-color);
        }

        .advice-inner-page .header h3 {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            font-size: 18px;
        }

            .advice-inner-page .header h3 span {
                font-family: Tajawal;
                font-size: 16px;
                font-weight: 500;
                text-align: left;
                color: var(--primary-color);
                direction: ltr;
                display: flex;
                flex-direction: row-reverse;
                gap: 5px;
            }

            .advice-inner-page .header h3 i {
                color: var(--primary-color);
            }

    .advice-inner-page .advice-text {
        direction: ltr;
    }

        .advice-inner-page .advice-text h1 {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 700;
            color: #191919;
        }

        .advice-inner-page .advice-text p {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: justify;
            color: #191919;
            margin-bottom: 45px;
        }

        .advice-inner-page .advice-text ul {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            color: #191919;
            margin-bottom: 45px;
            padding: 17px !important;
        }

            .advice-inner-page .advice-text ul li {
                display: list-item;
                list-style: decimal;
            }

/* End advice-inner-page Section */

/* Start Open-data-form Section */

/* End Open-data-form Section */

/* Start polls-page Section */
.polls-page {
}

    .polls-page .polls-header {
        margin-bottom: 50px;
        margin-top: 50px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

        .polls-page .polls-header .search {
            position: relative;
            display: flex;
            flex-direction: row;
            align-items: center;
        }

            .polls-page .polls-header .search button {
                width: 72px;
                height: 65px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                background: var(--primary-color);
                outline: none;
                border: none;
                border-radius: 0 8px 8px 0;
            }

            .polls-page .polls-header .search input {
                width: 420px;
                height: 65px;
                border-radius: 8px 0 0 8px;
                border: 1px solid #d4dde9;
                padding-right: 20px;
                padding-left: 20px;
                direction: ltr;
            }

        .polls-page .polls-header .btns {
            height: 65px;
            border: 1px solid #d4dde9;
            border-radius: 8px;
            overflow: hidden;
            display: flex;
            flex-direction: row;
        }

            .polls-page .polls-header .btns button {
                width: 200px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                color: #000;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 700;
                text-align: center;
                background-color: transparent;
                outline: none;
                border: none;
            }

                .polls-page .polls-header .btns button.active {
                    color: #fff;
                    background: var(--primary-color);
                }

    .polls-page .polls-content {
        direction: ltr;
    }

        .polls-page .polls-content .info {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            justify-content: space-between;
            margin-top: 50px;
            margin-bottom: 50px;
        }

            .polls-page .polls-content .info button {
                width: 130px;
                height: 47px;
                background: #faf9f8;
                padding: 20px;
                border-radius: 8px;
                border: none;
                outline: none;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                gap: 10px;
            }

                .polls-page .polls-content .info button i {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    width: 32px;
                    height: 32px;
                    border-radius: 7px;
                    background: var(--primary-color);
                    color: #fff;
                }

                .polls-page .polls-content .info button span {
                    font-family: Tajawal;
                    font-size: 14px;
                    font-weight: 500;
                    text-align: center;
                    color: var(--primary-color);
                }

            .polls-page .polls-content .info h3 {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 5px;
                font-size: 18px;
            }

                .polls-page .polls-content .info h3 span {
                    font-family: Tajawal;
                    font-size: 17px;
                    font-weight: 500;
                    text-align: left;
                    color: var(--primary-color);
                }

                .polls-page .polls-content .info h3 i {
                    color: var(--primary-color);
                }

    .polls-page .form-element {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 31px;
    }

        .polls-page .form-element .options button {
            width: 130px !important;
        }

    .polls-page h1 {
        font-family: Tajawal;
        font-size: 20px;
        font-weight: 700;
        text-align: left;
        color: #383838;
        margin-bottom: 30px;
    }

    .polls-page .form-element .input {
        direction: rtl;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 10px;
        margin-bottom: 19px;
    }

        .polls-page .form-element .input label {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: left;
            color: #383838;
        }

        .polls-page .form-element .input input {
            cursor: pointer;
        }

    .polls-page .form-element .options {
        margin-top: 30px;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-around;
        width: 100%;
    }

        .polls-page .form-element .options button:nth-child(1) {
            width: 290px;
            height: 45px;
            border-radius: 8px;
            background-color: var(--primary-color);
            color: #fff;
            outline: none;
            border: none;
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            justify-content: center;
            gap: 15px;
        }

        .polls-page .form-element .options button:nth-child(2) {
            width: 210px;
            height: 47px;
            border-radius: 8px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            gap: 5px;
            background-color: transparent;
            outline: none;
            border: none;
        }

@media(max-width:500px) {



    footer .upper-footer-content ul a {
        font-size: 10px !important;
    }

    .polls-page .form-element .options {
        justify-content: space-around !important;
    }

        .polls-page .form-element .options button {
            width: 130px !important;
        }
}

.polls-page .poll-results {
    height: 260px;
    border-radius: 10px;
    padding: 30px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 26px;
    border: 1px solid #d4dde9;
}

    .polls-page .poll-results .result {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        gap: 5px;
        width: 100%;
    }

        .polls-page .poll-results .result span {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            width: 10%;
        }

        .polls-page .poll-results .result .result-bar {
            width: 100%;
        }

            .polls-page .poll-results .result .result-bar .bar {
                height: 22px;
                background: #c3b79a;
            }

        .polls-page .poll-results .result h2 {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: left;
            width: 20%;
        }

/* End polls-page Section */

/* Start Policypage Section */

.policy-page .policy-page-text {
    direction: ltr;
}

    .policy-page .policy-page-text h1 {
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 700;
        color: #191919;
    }

    .policy-page .policy-page-text p {
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        text-align: justify;
        color: #191919;
        /*margin-bottom: 45px;*/
    }

    .policy-page .policy-page-text ul {
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        color: #191919;
        /*margin-bottom: 45px;*/
        padding: 0 17px !important;
    }

        .policy-page .policy-page-text ul li {
            display: list-item;
            /*      list-style: decimal;*/
        }

/* End Policypage Section */

/* Start open-data-main Section */

.open-data-main .data-main {
    width: 100%;
    height: 250px;
    border: 2px solid #e8eef7;
    border-radius: 8px;
    margin-bottom: 30px;
}

    .open-data-main .data-main a {
        width: 100%;
        height: 250px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 30px;
    }

        .open-data-main .data-main a h2 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: center;
            color: #26283b;
        }

/* End open-data-main Section */

/* Start usage-analytics-page Section */

.usage-analytics-page .analytic {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin-top: 18px;
    width: 100%;
    height: 250px;
    border: 2px solid #e8eef7;
    border-radius: 8px;
    margin-bottom: 30px;
}

    .usage-analytics-page .analytic a {
        width: 100%;
        height: 250px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 30px;
    }

    .usage-analytics-page .analytic h3 {
        font-family: Tajawal;
        font-size: 15px;
        font-weight: 700;
        text-align: center;
        color: #26283b;
    }

    .usage-analytics-page .analytic h2 {
        font-family: Tajawal;
        font-size: 18px;
        font-weight: 700;
        text-align: center;
        color: #26283b;
    }

.usage-analytics-page h1 {
    font-family: Tajawal;
    font-size: 22px;
    font-weight: 700;
    color: #26283b;
    text-align: left;
    width: 100%;
}

/* End usage-analytics-page Section */

/* Start speeds-table content-table Section */

/*.speeds-page .header .search {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
    background-color: #f5f7fa;
    border: 2px solid #e8eef7;
    border-radius: 8px;
}*/

/*    .speeds-page .header .search button {
        width: 60px;
        height: 65px;
        background: var(--primary-color);
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        border-radius: 0 8px 8px 0;
        outline: none;
        border: none;
    }*/

.speeds-page .header .search .custom-date-input {
    width: 15%;
    position: relative;
    direction: ltr;
}

    .speeds-page .header .search .custom-date-input i {
        position: absolute;
        right: 56px;
        top: 50%;
        transform: translateY(-50%);
    }

    .speeds-page .header .search .custom-date-input input:nth-child(2) {
        width: 147px;
        height: 44px;
        border-radius: 8px;
        border: 1px solid #e8eef7;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        direction: ltr;
    }

.speeds-page .header .search > label {
    font-size: 15px;
    font-weight: 500;
    text-align: left;
    color: #26293e;
}

.speeds-page .header .search > input {
    width: 100%;
    height: 65px;
    border-radius: 10px 0 0 10px;
    outline: none;
    border: none;
    padding: 15px;
    text-align: left;
    font-size: 16px;
    color: #000;
}

.speeds-page .header .search > select {
    width: 15%;
    height: 40px;
    border-radius: 10px 0 0 10px;
    outline: none;
    border: none;
    padding: 15px;
    text-align: left;
    font-size: 16px;
    color: #000;
    direction: ltr;
}

.content-table {
    width: 100%;
    overflow-x: scroll;
}

    .content-table table {
        width: 1298px;
    }

        .content-table table tr {
            border: 1px solid #000;
            border-radius: 29px;
            margin: 15px;
            padding: 10px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            border: 2px solid #e8eef7;
            border-radius: 8px;
            gap: 22px;
            transition: 0.5s;
        }

            .content-table table tr:hover {
                background-color: #eee;
            }

            .content-table table tr:nth-child(1) {
                border: none;
            }

            .content-table table tr th {
                font-family: Tajawal;
                font-size: 16px;
                font-weight: 700;
                text-align: left;
                color: #161616;
                width: 20%;
            }

                .content-table table tr th:nth-last-child(2) {
                    width: 40%;
                }

            .content-table table tr td {
                width: 20%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: flex-end;
            }

                .content-table table tr td h4 {
                    font-family: Tajawal;
                    font-size: 17px;
                    font-weight: 500;
                    text-align: left;
                    color: #26283b;
                    text-align: left;
                    direction: ltr;
                    line-height: 27px;
                }

                .content-table table tr td:nth-last-child(2) {
                    width: 40%;
                }

                .content-table table tr td h2 {
                    font-family: Tajawal;
                    font-size: 17px;
                    font-weight: 500;
                    text-align: left;
                    color: #26283b;
                    width: 100%;
                }

    .content-table button {
        background-color: transparent;
        outline: none;
        border: none;
        margin-right: 17px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        width: 25px;
        height: 25px;
        border-radius: 8px;
        background: #f5f7fa;
    }

    .content-table a {
        background-color: transparent;
        outline: none;
        border: none;
        margin-right: 17px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        width: 25px;
        height: 25px;
        border-radius: 8px;
        background: #f5f7fa;
        outline: none;
    }

/* End speeds-table content-table Section */

/* Start  open-data-form-2 Section */
.open-data-form-2 {
    margin-bottom: 100px;
}

    .open-data-form-2 .inputs .special-input {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
    }

    .open-data-form-2 .date-input {
        font-size: 20px;
        position: absolute;
        right: 20px;
        z-index: 3;
        color: #999292;
        top: 15px;
    }

/* End  open-data-form-2 Section */

/* Start three-d-open-data Section */

.three-d-open-data {
    direction: rtl !important;
}

    .three-d-open-data .header .search {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #e8eef7;
        border-radius: 8px;
    }

        .three-d-open-data .header .search button {
            width: 60px;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 0 8px 8px 0;
            outline: none;
            border: none;
        }

        .three-d-open-data .header .search .custom-date-input {
            width: 15%;
            position: relative;
            direction: ltr;
        }

            .three-d-open-data .header .search .custom-date-input i {
                position: absolute;
                right: 56px;
                top: 50%;
                transform: translateY(-50%);
            }

            .three-d-open-data .header .search .custom-date-input input:nth-child(2) {
                width: 147px;
                height: 44px;
                border-radius: 8px;
                border: 1px solid #e8eef7;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                direction: ltr;
            }

        .three-d-open-data .header .search > label {
            font-size: 15px;
            font-weight: 500;
            text-align: left;
            color: #26293e;
        }

        .three-d-open-data .header .search > input {
            width: 23%;
            height: 40px;
            border-radius: 10px 0 0 10px;
            outline: none;
            border: none;
            padding: 15px;
            text-align: left;
            font-size: 16px;
            color: #000;
        }

        .three-d-open-data .header .search > select {
            width: 15%;
            height: 40px;
            border-radius: 10px 0 0 10px;
            outline: none;
            border: none;
            padding: 15px;
            text-align: left;
            font-size: 16px;
            color: #000;
            direction: ltr;
        }

    .three-d-open-data .open-data-stats .stats-header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 34px;
    }

        .three-d-open-data .open-data-stats .stats-header .btns {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            gap: 25px;
        }

            .three-d-open-data .open-data-stats .stats-header .btns button {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                gap: 5px;
                background-color: transparent;
                outline: none;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 500;
                text-align: left;
                color: #26293e;
                border: none;
                outline: none;
            }

        .three-d-open-data .open-data-stats .stats-header h1 {
            font-family: Tajawal;
            font-size: 24px;
            font-weight: 700;
            text-align: left;
            color: #26283b;
        }

    .three-d-open-data .open-data-stats .slider .slide .state {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

        .three-d-open-data .open-data-stats .slider .slide .state img:nth-child(1) {
            width: 70%;
            height: 400px;
            object-fit: contain;
        }

        .three-d-open-data .open-data-stats .slider .slide .state img:nth-child(2) {
            width: 30%;
            height: 400px;
            object-fit: contain;
        }

/* End three-d-open-data Section */

/* Start commander-talk Section */
.commander-talk {
}

    .commander-talk .commander-image {
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

        .commander-talk .commander-image img {
            height: 450px;
            width: 100%;
            object-fit: contain;
        }

    .commander-talk .text {
        color: #26283b;
        direction: ltr;
    }

        .commander-talk .text h1 {
            font-family: Tajawal;
            font-size: 32px;
            font-weight: 700;
            text-align: left;
            margin-bottom: 30px;
        }

        .commander-talk .text h2 {
            font-family: Tajawal;
            font-size: 25px;
            font-weight: 500;
            text-align: left;
        }

        .commander-talk .text h3 {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            margin-bottom: 25px;
        }

        .commander-talk .text h4 {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 700;
        }

        .commander-talk .text p {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            text-align: justify;
            margin-bottom: 60px;
        }

/* End commander-talk Section */

/* Start organization-page Section */

.organization-page .organization {
    padding-bottom: 80px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

    .organization-page .organization h1 {
        height: 71px;
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        font-family: Tajawal;
        font-size: 20px;
        font-weight: 500;
        text-align: center;
        color: #fff;
        background: var(--primary-color);
        padding: 18px;
        border-radius: 8px;
    }

    .organization-page .organization h2 {
        border: 2px solid #e8eef7;
        width: 100%;
        height: 56px;
        border-radius: 8px;
        text-align: left;
        padding: 15px;
        font-family: Tajawal;
        font-size: 15px;
        font-weight: 500;
        text-align: left;
        color: #26283b;
        background-color: #fff;
    }

    .organization-page .organization .line-ver {
        height: 100%;
        position: absolute;
        background-color: #e8eef7;
        width: 1px;
        right: 50%;
        transform: translateX(50%);
        z-index: -1;
        top: -21px;
    }

    .organization-page .organization .line-hor {
        width: 211%;
        height: 1px;
        background-color: #e8eef7;
        top: -21px;
        position: absolute;
        right: 50%;
        transform: translateX(50%);
    }

/* End organization-page Section */

/* Start history-page Section */

.history-page .history-main-img {
    margin-bottom: 60px;
}

    .history-page .history-main-img img {
        width: 100%;
        object-fit: cover;
        height: 500px;
        border-radius: 10px;
    }

.history-page .history {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 60px;
}

    .history-page .history .text {
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        line-height: 26px;
        color: #000000;
        direction: ltr;
    }

    .history-page .history .image {
        position: relative;
    }

        .history-page .history .image h1 {
            position: absolute;
            top: 50%;
            right: 50%;
            transform: translate(50%, -50%);
            color: #fff;
            font-family: Tajawal;
            font-size: 51px;
            font-weight: 500;
            letter-spacing: 0.03em;
            text-align: center;
        }

        .history-page .history .image img {
            width: 300px;
            height: 200px;
            object-fit: cover;
            border-radius: 10px;
        }

/* End history-page Section */

/* Start overview-page Section */


/* Modefied by Yosef on 29-4-2025 */
.overview-page .text {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .overview-page .text h1,
    .overview-page .text p {
        text-align: center !important;
    }

.overview-page .image {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    margin-top: 80px;
}

    .overview-page .image img {
        width: 100%;
        height: 350px;
        object-fit: contain;
    }

.overview-page .text {
    height: 100%;
    display: flex;
    flex-direction: column;
    /* Modefied by Yosef on 24-4-2025 */
    align-items: center;
    padding: 15px;
}

    .overview-page .text h1 {
        font-family: Tajawal;
        font-size: 34px;
        font-weight: 700;
        text-align: left;
    }

    .overview-page .text p {
        font-family: Tajawal;
        font-size: 18px;
        font-weight: 500;
        text-align: left;
        margin-top: 20px;
    }

    .overview-page .text ul {
        font-family: Tajawal;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px;
        text-align: left;
        display: flex;
        flex-wrap: wrap;
        margin-top: 26px;
    }

        .overview-page .text ul li {
            width: 100%;
            margin-bottom: 15px;
        }

    .overview-page .text .one-to-one {
        flex-direction: row;
    }

        /* Modefied by Yosef on 24-4-2025 */
        .overview-page .text .one-to-one ul li {
            display: flex;
            justify-content: center;
            align-items: center;
        }

    .overview-page .text .one-col {
        flex-direction: column;
    }

    .overview-page .text ul.one-col li {
        width: 100%;
        margin-bottom: 15px;
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 15px;
    }

/* End overview-page Section */

/* Start questionnaires-inner Section */

.questionnaires-inner .questionnaires-inner-content {
    direction: ltr;
}

    .questionnaires-inner .questionnaires-inner-content h1 {
        font-family: Tajawal;
        font-size: 31px;
        font-weight: 700;
        text-align: left;
        color: #000000;
        margin-bottom: 60px;
    }

    .questionnaires-inner .questionnaires-inner-content .inputs {
        margin-bottom: 41px;
    }

        .questionnaires-inner .questionnaires-inner-content .inputs h2 {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            text-align: left;
            color: #000000;
            margin-bottom: 20px;
        }

        .questionnaires-inner .questionnaires-inner-content .inputs .input-radio {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            gap: 10px;
            justify-content: flex-end;
            margin-top: 10px;
        }

            .questionnaires-inner .questionnaires-inner-content .inputs .input-radio label {
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: left;
                color: var(--primary-color);
            }

.questionnaires-inner .star-rating {
    direction: rtl; /* Right to left to simplify hover effect */
    width: fit-content;
}

    .questionnaires-inner .star-rating .star {
        font-size: 30px;
        color: gray;
        cursor: pointer;
    }

    /* Hide the radio buttons */

    .questionnaires-inner .star-rating input[type="radio"] {
        display: none;
    }

        /* Gold star styles for hover and checked states */

        .questionnaires-inner .star-rating input[type="radio"]:checked ~ label,
        .questionnaires-inner .star-rating label:hover,
        .questionnaires-inner .star-rating label:hover ~ label {
            color: gold;
        }

.star-rating .active {
    color: gold;
}

.questionnaires-inner .questionnaires-inner-content .inputs .input input {
    width: 50%;
    height: 55px;
    border: 1px solid #dae2ee;
    padding-right: 25px;
    padding-left: 20px;
    color: #000;
    font-size: 16px;
    border-radius: 10px;
}

.questionnaires-inner .questionnaires-inner-content .inputs .input textarea {
    width: 100%;
    height: 170px;
    border: 1px solid #dae2ee;
    padding-right: 25px;
    padding-left: 20px;
    color: #000;
    font-size: 16px;
    border-radius: 10px;
}

.questionnaires-inner .questionnaires-inner-content .inputs .input .btns {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
}

    .questionnaires-inner
    .questionnaires-inner-content
    .inputs
    .input
    .btns
    button {
        width: 144px;
        height: 50px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        gap: 10px;
        color: #000;
        font-family: Tajawal;
        font-size: 14px;
        font-weight: 500;
        text-align: center;
        background: #faf9f8;
    }

.questionnaires-inner .questionnaires-inner-content .inputs .input .natio-btns {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
}

    .questionnaires-inner
    .questionnaires-inner-content
    .inputs
    .input
    .natio-btns
    button {
        width: 270px;
        height: 55px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        background-color: transparent;
        border: 1px solid #dae2ee;
        outline: none;
        border-radius: 10px;
    }

    .questionnaires-inner
    .questionnaires-inner-content
    .inputs
    .input
    .natio-btns
    select {
        width: 236px;
        height: 55px;
        border: 1px solid #dae2ee;
        padding-right: 25px;
        padding-left: 20px;
        color: #000;
        font-size: 16px;
        border-radius: 10px;
    }

.questionnaires-inner .questionnaires-inner-content .form-element > button {
    width: 220px;
    height: 45px;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 15px;
    color: #fff;
    background: var(--primary-color);
    justify-content: center;
    border: none;
    outline: none;
    border-radius: 10px;
}

/* End questionnaires-inner Section */

/* Default: Hide the div (for mobile devices) */
/*.side-social-media {
    display: none !important;
}
*/
.speeds-table.content-table {
    overflow: hidden !important;
}

.faq-groups {
    padding: 2%
}

.faq-group {
    padding: 1%
}

.faq-groups h3 {
    direction: ltr;
}
/* Show the div for devices with a screen width of at least 600px (tablets, small laptops) */
/*@media (min-width: 600px) {
    .side-social-media {
        display: block;
    }
}*/

/* Optional: Additional styles for larger screens (e.g., large laptops, desktops) */
/*@media (min-width: 1024px) {
    .side-social-media {
        display: block;
    }
}*/

/* Default: Hide the div (for mobile devices) */
.news-dates-toggle-btns {
    display: none;
}

/* Show the div for devices with a screen width of at least 600px (tablets, small laptops) */
@media (min-width: 600px) {
    .news-dates-toggle-btns {
        display: block;
    }
}

/* Optional: Additional styles for larger screens (e.g., large laptops, desktops) */
@media (min-width: 1024px) {
    .news-dates-toggle-btns {
        display: block;
    }
}

/* Default: Hide the div (for mobile devices) */
.news-categories-toggle-btns {
    display: none;
}

/* Show the div for devices with a screen width of at least 600px (tablets, small laptops) */
@media (min-width: 600px) {
    .news-categories-toggle-btns {
        display: block;
    }
}

/* Optional: Additional styles for larger screens (e.g., large laptops, desktops) */
@media (min-width: 1024px) {
    .news-categories-toggle-btns {
        display: block;
    }
}

/* Default: Hide the div (for mobile devices) */
.short-cuts {
    display: block;
}

/* Show the div for devices with a screen width of at least 600px (tablets, small laptops) */
@media (min-width: 600px) {
/*    body .short-cuts {
        top: 35% !important;
    }*/
    .landing .landing-content .toggle-screen-btns-container {
        overflow-x: auto;
    }
}

/* Optional: Additional styles for larger screens (e.g., large laptops, desktops) */
/*@media (min-width: 1024px) {
    .short-cuts {
        display: block;
    }
}*/

/* Modefied by Yosef on 23-4-2025 */
.statcounter {
    display: none;
}
/*@media (min-width: 300px) and (max-width: 950px) {
    .publications-page .header .search > input,
    .laws-and-legistations .laws-content .laws-search > input,
    .speeds-page .header .search > input {
        border: 1px solid #6d6249 !important;
        width: 95% !important;
        border-radius: 10Px !important;
    }

    .publications-page .header .search button,
    .speeds-page .header .search button {
        width: 95% !important;
    }
}*/


.side-social-media-formobile {
    display: none !important;
}
/* Modefied by Yosef on 24-4-2025 */
@media (max-width: 500px) {
    .support-form .support-form-content .data-form .buttons {
        margin: auto;
    }

    nav .mobileNavdDrawer .nav-elements .nav-element:nth-child(1),
    nav .mobileNavdDrawer .nav-elements .nav-element:nth-child(3) {
        width: 15% !important; /* or your desired width */
    }

    footer .lower-footer-content ul {
        margin-top: 0 !important;
    }

    footer .lower-footer-content .clients-stats {
        display: none !important;
    }

    .clients {
        min-height: 158px !important;
    }

    .news-inner-page .news-text .header {
        flex-direction: column;
    }

        .news-inner-page .news-text .header h3 {
            margin-top: 30px;
        }

    side-social-media {
        display: none !important;
    }


    .overview-page .text p {
        text-align: center !important;
    }

    .contact-us-page .police-stations .stations {
        flex-direction: column !important;
    }

    .contact-us-page .police-stations button {
        height: 72px !important;
    }

    .contact-us-page .police-stations .stations .station {
        margin-bottom: 0 !important;
    }

    .rate-content .rate-content-options .options {
        display: flex !important;
        flex-direction: row !important;
        gap: 6px !important;
        justify-content: space-around !important;
    }

    .page-header .page-header-content .page-header-info ul {
        justify-content: center !important;
    }

    .page-header .page-header-content .page-header-info h1 {
        text-align: center !important;
    }

    .page-header .page-header-content img {
        width: 75% !important;
    }

    /*        .services-header {
            margin-top: 95px !important;
        }*/

    .our-services .landing-services .services-slider .slide .service img {
        height: 100px !important;
    }

    .services-header .toggle-services-categories-btns {
        overflow-x: scroll !important;
        scrollbar-width: thin;
    }

    toggle-services-categories-btns
    .contact-us-page .contact-us-footer .right {
        display: block;
    }

    .speeds-page .table {
        overflow-x: auto;
        white-space: nowrap;
        width: 100%;
    }

        .speeds-page .table .custom {
            gap: 90px;
        }

        .speeds-page .table .custom2 {
            width: fit-content;
        }


    .polls-page h1 {
        text-align: left !important;
    }

    /* Modefied by Yosef on 27-4-2025 */
    .news-page .news-dates-toggle-btns .months {
        display: flex;
        align-items: center;
        overflow-x: scroll;
        flex-direction: row-reverse;
    }

    .landing .screens .screen .last-news .all-news .news-slider .slide .blog {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .landing .screens .screen .our-services .identity-number-search .input {
        width: 315px !important;

    }
    /*
    .landing .screens .screen .our-services .landing-services .services-slider .slide .service {
        width: 92% !important;
        margin-bottom: 26px !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }*/

    .landing .screens .screen .our-services .landing-services .services-slider .slide .service a {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
    }

    .services .services-categories .category .category-services-slider .slide .service {
        margin: auto;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: space-between !important;
    }

        .services .services-categories .category .category-services-slider .slide .service h1 {
            text-align: center !important;
        }

    .services-header .service-header-content .options .input {
        margin: auto;
    }

    .landing .screens .screen .support-help {
        height: auto !important;
        padding-top: 35px !important;
    }

        .landing .screens .screen .support-help .options a .option img {
            align-self: center;
        }

        .landing .screens .screen .support-help .options a .option h1, h2 {
            text-align: center !important;
        }

    .service-apply .service-details-header h1, h2 {
        text-align: center !important;
    }

    .landing .screens .screen .support-help .options {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        justify-content: space-between;
    }

        .landing .screens .screen .support-help .options a .option {
            height: 220px !important;
        }

    .contact-us-page .contact-options {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        margin-bottom: 80px;
    }

    .landing .screens .screen .support-help > a {
        margin: 40px !important;
    }

    .contact-us-page .contact-options .option h3, h2 {
        text-align: center !important;
    }

    .contact-us-page .contact-options .option a {
        align-items: center !important;
    }

    .contact-us-page .contact-us-footer {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    footer .lower-footer-content ul {
        justify-content: center !important;
    }

    /*        .RadSearchBox .rsbInput {
            border: 1px solid #ffffff !important;
            border-radius: 3px;
        }*/

    .page-header .page-header-content .page-header-info {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-right: 27px;
    }

    .landing .landing-content .toggle-screen-btns {
        margin: auto;
    }


    .police-auto-talker {
        z-index: 500000 !important;
        width: 100% !important;
        left: 0 !important;
    }

    nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(3) .search-input button {
        padding: 0 !important;
    }

    .contact-us-page .contact-us-footer .right {
        margin: auto !important;
    }

    .service-apply .apply-service-form .input-auth .input > div {
        justify-content: center !important;
    }

    .page-header .page-header-content .page-header-info {
        display: flex;
        flex-direction: column;
    }

    .service-apply .apply-service-form {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .service-apply .service-details-header {
        justify-content: center;
        flex-direction: column;
        display: flex;
        align-items: center;
    }

    .service-apply .apply-service-form .buttons {
        flex-direction: column-reverse !important;
    }
    /*  .service-apply .apply-service-form .buttons {
        width: auto;
        margin: auto;
    }*/

    .page .overview-page .container .row div:nth-child(1) {
        order: 1;
    }

    .page .overview-page .container .row div:nth-child(2) {
        order: 2;
    }

    .page .overview-page .container .row div:nth-child(3) {
        order: 4;
    }

    .page .overview-page .container .row div:nth-child(4) {
        order: 3;
    }

    .page .overview-page .container .row div:nth-child(5) {
        order: 5;
    }

    .page .overview-page .container .row div:nth-child(6) {
        order: 6;
    }

    .page .overview-page .container .row div:nth-child(7) {
        order: 8;
    }

    .page .overview-page .container .row div:nth-child(8) {
        order: 7;
    }

    .commentModal {
        width: 85% !important;
    }

    .usage-analytics-page h1 {
        text-align: center !important;
    }

    .three-d-open-data .open-data-stats .stats-header h1 {
        text-align: center !important;
    }

    .news-page .news-item .text {
        bottom: 120px !important;
    }

    .overview-page .text .one-to-one {
        width: 100%;
        margin: auto;
    }

    .news-page .container .row {
        justify-content: center !important;
    }

    .polls-page .poll-results .result span {
        width: 25% !important;
    }


    .speeds-page .content-table {
        width: 100%;
        overflow-x: scroll !important;
    }

    .data-form-content .data-form .inputs .input {
        align-items: flex-start;
    }

    .services-page .container .row :nth-child(1) {
        order: 2;
    }

    .services-page .container .row :nth-child(2) {
        order: 1;
    }

    .services-page .container .row :nth-child(3) {
        order: 3;
    }

    .services-page .container .row :nth-child(4) {
        order: 4;
    }

    .services-page .container .row :nth-child(5) {
        order: 6;
    }

    .services-page .container .row :nth-child(6) {
        order: 5;
    }

    .services-page .container .row :nth-child(7) {
        order: 7;
    }

    .services-page .container .row :nth-child(8) {
        order: 8;
    }

    .upper-nav .upper-nav-content {
        display: flex !important;
        flex-direction: row-reverse !important;
        justify-content: space-between !important;
    }

    /*    .side-nav {
        width: 85% !important;
    }*/
    /*   .side-social-media {
        display: none !important;
    }

        .side-social-media:hover, .side-social-media:active, .side-social-media:focus {
            display: block !important;
        }
        .side-social-media.initial {
            display: block !important;
        }*/



    .news-moving-slider .news-moving-content h2 {
        width: 50% !important;
        left: -10px !important;
        padding: 5px !important;
    }

    .landing .landing-content .toggle-screen-btns {
        width: fit-content !important;
    }

        .landing .landing-content .toggle-screen-btns button {
            width: 150px !important;
        }

    .landing .screens .screen .new-about-police .slider-btns {
        position: relative !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        align-content: center !important;
        left: unset !important;
        top: 22px;
    }

    .landing .screens .screen .new-about-police .images-slider .slide img {
        object-fit: contain !important;
    }

    .services-header .service-header-content {
        flex-direction: column-reverse !important;
    }

    .services-header .toggle-services-categories-btns {
        flex-direction: row-reverse !important;
        flex-wrap: nowrap !important;
    }

    footer .upper-footer-content {
        flex-direction: column !important;
    }

    footer .lower-footer-content {
        flex-direction: column !important;
    }

    .copy-right .copy-right-content {
        flex-direction: row !important;
    }

    .services .services-categories .category .category-services-slider .slide {
        margin: auto;
    }

    ::webkit-scrollbar-button {
        display: none;
    }

    .landing .landing-content .toggle-screen-btns-container {
        direction: ltr !important;
        overflow-x: scroll !important;
        scrollbar-width: thin;
    }

    /* Modefied by Yosef on 27-4-2025 */
    .landing .screens .screen .new-about-police .slider-btns {
        right: unset !important;
    }

    footer .upper-footer-content ul {
        justify-content: center !important;
    }
    /* Modefied by Yosef on 29-4-2025 */
    /*nav .mobileNavdDrawer .nav-elements .nav-element:nth-child(1),
        nav .mobileNavdDrawer .nav-elements .nav-element:nth-child(3) {
            width: 20% !important;*/ /* or your desired width */
    /*}*/



    /*        nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile .langs {
            top: -2px !important;
        }*/

    /*        nav .mobileNavdDrawer .nav-elements .nav-element > button {
            padding: 3px !important;
        }*/

    nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile {
        padding: 0 !important;
    }

    .search-input {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .rsbLoadingIcon {
        display: none !important;
    }

    .RadSearchBox .rsbInput {
        width: 100% !important;
    }



    /*    .RadSearchBox_Silk .rsbInner {
        display: flex;
        justify-content: flex-end !important;
    }
*/
    .side-nav {
        width: 100% !important;
    }

        .side-nav .side-nav-content {
            align-items: flex-end !important;
        }

            .side-nav .side-nav-content #close-side-menu {
                position: unset !important;
            }

    /* Modefied by Yosef on 4-5-2025 */
    .landing .screens .screen .new-about-police .slider-center-btns {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 107%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding: 15px;
        z-index: 15;
        height: 0;
        padding: 0;
    }

        .landing .screens .screen .new-about-police .slider-center-btns button {
            background-color: transparent;
            outline: none;
            border: none;
            font-size: 72px;
            color: var(--primary-color);
        }

    .services .services-categories {
        margin-bottom: 0 !important;
    }
}
/*@media(min-width: 500px) and (max-width: 600px) {
    nav .mobileNavdDrawer .nav-elements .nav-element > button {
        padding: 0 !important;
    }
}*/
@media (max-width: 950px) {
    .landing .screens .screen .last-news .all-news .news-slider .slide .blog {
        width: 100% !important;
        min-height: 465px;
        position: relative;
        margin-left: 0;
        margin-right: 0;
    }
}

@media (min-width: 300px) and (max-width:1025px) {


    /* Modefied by Yosef on 30-4-2025 */
    .fas fa-circle-notch fa-spin {
        font-size: unset !important;
    }

    /*        .services-header .service-header-content {
            margin-top: 85px;
        }*/

    .landing .screens .screen .new-about-police .slider-btns {
        position: relative;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 15px;
        justify-content: center;
    }

    .services-page .container .row {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column !important;
        align-items: center;
    }

        .services-page .container .row :nth-child(1) {
            order: 2;
        }

        .services-page .container .row :nth-child(2) {
            order: 1;
        }

        .services-page .container .row :nth-child(3) {
            order: 3;
        }

        .services-page .container .row :nth-child(4) {
            order: 4;
        }

        .services-page .container .row :nth-child(5) {
            order: 6;
        }

        .services-page .container .row :nth-child(6) {
            order: 5;
        }

        .services-page .container .row :nth-child(7) {
            order: 7;
        }

        .services-page .container .row :nth-child(8) {
            order: 8;
        }
}
@media (min-width: 300px) and (max-width: 1425px) {

    .headingSearch {
        font-size: larger;
    }
    .RadSearchBox_Silk .rsbHovered.rsbInner {
        border-color: unset;
        color: unset;
        background-color: unset;
    }
    .RadSearchBox_Silk .rsbInner {
        border: 1px solid var(--secondary-color) !important;
        border-radius: 5px !important;
    }

    nav .mobileNavdDrawer .nav-element:nth-of-type(3) {
        border-radius: 0 7px 7px 0 !important;
    }

    nav .mobileNavdDrawer .nav-element:nth-of-type(1) {
        border-radius: 7px 0 0 7px !important;
    }
    .list-group .content-table table,
    .content-table table {
        width: 100% !important
    }
    .rsbListItem:hover {
        background-color: rgb(219 196 171);
        color: white;
    }

    .rsbList, .rsbPopup, .rsbPopup_Silk {
        border-radius: 0 0 10px 10px;
        cursor: pointer;
    }

    .rsbSlide {
        border-radius: 0 0 10px 10px;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    }
/*    .rsbListItem {
        text-align: left !important;
    }
    .rsbPopup .rsbList {
        display: flex;
        flex-direction: column;
        align-content: flex-start;
        align-items: flex-start;
        flex-wrap: wrap;
    }*/
    }

    @media (min-width: 500px) and (max-width: 1425px) {


        .news-moving-slider .news-moving-content h2 {
            width: 25% !important;
            left: -10px !important;
            padding: 5px !important;
        }

        .news-page .news-item {
            width: 100% !important;
            min-height: 465px !important;
            position: relative !important;
            margin-right: 0 !important;
            margin-left: 0 !important;
        }

        .clients {
            min-height: 280px;
        }
        /*    nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile .langs {
        padding: 0 10px !important;
    }*/
    }

    @media (min-width: 1024px) and (max-width:1425px) {

        .landing .screens .screen .our-services .landing-services .services-slider .slide .service {
            width: 185px !important;
        }

        .services .services-categories .category .category-services-slider .slide .service {
            width: 205px;
        }

        footer .lower-footer-content {
            display: flex;
            flex-direction: column;
        }
    }
    /* Modefied by Yosef on 29-4-2025 */
    @media (max-width: 1426px) {
        .skiptranslate {
            display: none !important;
        }

        .inner-short-cut .status-element {
            left: 6px !important;
            margin-right: 0 !important;
        }

        .inner-short-cut .accessibility {
            width: 350px !important;
            top: unset !important;
            transform: translateY(-40%) !important;
            left: 6px !important;
        }

        .inner-short-cut .happines-element {
            left: 6px !important;
            transform: translateY(-30%) !important;
            top: unset !important;
        }

            .inner-short-cut .happines-element .content .element .form-element .submit-btns .submitFeedback {
                width: 147px !important;
            }

        .inner-short-cut .status-element, .inner-short-cut .happines-element {
            width: 350px !important;
        }

        .inner-short-cut .accessibility .accessibility-content .options .option {
            height: auto;
            margin-bottom: auto;
        }

        body .short-cuts {
            left: 0px !important;
            top: 33% !important;
        }

        .short-cuts .content {
            gap: 3px !important;
            margin-left: 7px;
        }

            .short-cuts .content .icon {
                width: 35px;
            }

        .side-social-media {
            display: none !important;
        }
        /* Modefied by Yosef on 4-5-2025 */
        .side-social-media-formobile {
            display: flex !important;
            width: auto !important;
            z-index: 30;
            position: fixed;
            top: 50%;
            left: 0%;
            flex-direction: column;
            align-items: flex-start;
            justify-content: center;
        }

            .side-social-media-formobile .hover-ele-formobile,
            .side-social-media-formobile .hover-service-formobile {
                width: 50px;
                height: 50px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                background-color: #fff;
                border-radius: 8px;
                font-size: 25px;
            }

            .side-social-media-formobile .socials-formobile.initial {
                left: 0 !important;
            }

            .side-social-media-formobile .socials-formobile {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 8px;
                background-color: var(--primary-color);
                color: #fff;
                width: 25px;
                padding-top: 20px;
                padding-bottom: 20px;
                border-radius: 8px;
                position: relative;
                transition: left 0.3s ease-in-out;
                left: -55px;
                width: 25px !important;
            }

                .side-social-media-formobile .socials-formobile a {
                    color: #fff;
                }

                    .side-social-media-formobile .socials-formobile a i {
                        transition: 0.5s !important;
                    }

        #open-side-menu_mobile img {
            transform: scaleX(-1);
        }

        .RadSearchBox {
            width: 100% !important;
            min-width: unset !important;
        }

        nav .mobileNavdDrawer .nav-elements .nav-element:not(:nth-child(1)):not(:nth-child(3)) {
            width: 60% !important; /* or 70%, 100%, etc. depending on your layout */
        }

        .search-input {
            height: 40px;
        }

            .search-input button#btnSearch {
                position: absolute;
                right: 0px;
                z-index: 50;
                padding:15px !important
            }

        .RadSearchBox .rsbInput {
            text-align: left;
            padding-left: 15px !important;
            width: 95% !important;
        }

        .RadSearchBox_Silk .rsbLoadingIcon {
            display: none;
        }

        .search-input {
            flex-direction: row;
        }

        nav .mobileNavdDrawer .nav-elements .nav-element:nth-child(1),
        nav .mobileNavdDrawer .nav-elements .nav-element:nth-child(3) {
            width: 10%; /* or your desired width */
        }

        .RadSearchBox .rsbInner {
            padding: 0;
        }

        .RadSearchBox .rsbButtonSearch {
            left: unset !important;
        }

        .short-cuts {
            display: none;
        }

        #navbar .container {
            width: auto !important;
        }

        nav .nav-content,
        .mobileNavdDrawer .nav-elements .nav-element .toggle-menu,
        #open-adv-search {
            display: none !important;
        }

        nav .mobileNavdDrawer {
            display: block !important;
        }


            nav .mobileNavdDrawer .nav-elements {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
                gap: 15px;
            }


            nav .mobileNavdDrawer .nav-element {
                border-radius: 8px;
                /*padding: 5px;*/
                background-color: var(--secondary-color);
                height: 40px;
                position: relative;
            }

                /*        nav .mobileNavdDrawer .nav-elements > div {
            display: flex;
            flex-direction: row-reverse;
            justify-content: center;
        }*/

                nav .mobileNavdDrawer .nav-element > a {
                    color: #fff;
                    font-weight: 500;
                    font-size: 13px;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    gap: 6px;
                }

            nav .mobileNavdDrawer .nav-elements .nav-element > button {
                background-color: transparent;
                outline: none;
                border: none;
                color: #fff;
                display: flex;
                align-items: center;
                gap: 10px;
                font-weight: 500;
                font-size: 14px;
                padding: 0 25px 0 25px;
                width: 100%;
                justify-content: center;
                height: 100%;
            }

            nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile {
                transition: 0.5s;
                z-index: 15;
                /*padding: 2px;*/
            }

                nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile.active {
                    user-select: inherit;
                    pointer-events: inherit;
                }

                    nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile.active .langs {
                        padding: 10px;
                        flex-direction: column-reverse !important;
                        background-color: #fff;
                        border-radius: 6px;
                    }

                        nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile.active .langs a.active {
                            pointer-events: auto;
                            cursor: pointer;
                        }

                nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile .langs {
                    display: flex;
                    flex-direction: column-reverse;
                    align-items: center;
                    justify-content: space-between;
                    position: relative;
                    /*top: -5px;*/
                    width: 100%;
                }

                    nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile .langs a {
                        width: 151px;
                        height: 40px;
                        border-radius: 6px;
                        padding: 5px;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                        font-weight: 500;
                        font-size: 16px;
                        line-height: 26px;
                        color: #000;
                        background-color: #fff;
                        /*  transition: 0.5s;*/
                        z-index: 50;
                    }

                        nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile .langs a.active {
                            display: flex;
                            background-color: var(--secndary-color);
                            color: #fff;
                        }

                        nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile .langs a:not(.active) {
                            border: 1px solid var(--secondary-color);
                            border-radius: 0 0 6px 6px;
                            color: var(--secondary-color);
                        }

                    nav .mobileNavdDrawer .nav-elements .nav-element #langs-menu_mobile .langs a {
                        display: none;
                        width: inherit !important;
                    }

        .side-nav .side-nav-content .main-menu > li #UAEPASS a {
            background-color: unset !important;
            margin: auto !important;
        }
    }


    /* Start ShortCuts Section */
    body .short-cuts {
        position: fixed;
        left: 10px;
        top: 50%;
        transform: translateY(-50%) !important;
        z-index: 60000;
        direction: rtl;
    }

    .short-cuts .content {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

        .short-cuts .content .short-cut {
            position: relative;
        }

            .short-cuts .content .short-cut button {
                background-color: transparent;
                outline: none;
                border: none;
            }

    .inner-short-cut {
        display: none;
    }

        .inner-short-cut.active {
            display: block;
        }


        .inner-short-cut .happines-element {
            width: 400px;
            height: fit-content;
            background: #faf9f8;
            border-radius: 8px;
            padding: 20px;
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-38%);
            z-index: 15;
        }

            .inner-short-cut .happines-element .content h1 {
                font-family: Tajawal;
                font-size: 18px;
                font-weight: 500;
                text-align: center;
                color: #000000;
                margin-bottom: 23px;
            }

            .inner-short-cut .happines-element .content .element .form-element {
                display: flex;
                flex-direction: column;
                gap: 20px;
            }

            .inner-short-cut .happines-element .content .element .input {
                display: flex;
                flex-direction: row-reverse;
                align-items: center;
                justify-content: space-between;
            }

                .inner-short-cut .happines-element .content .element .input .faces {
                    display: flex;
                    flex-direction: row-reverse;
                    align-items: center;
                    justify-content: space-between;
                    width: 40%;
                }

            .inner-short-cut
            .happines-element
            .content
            .element
            .form-element
            .input
            .faces
            .face {
                width: fit-content;
                position: relative;
                cursor: pointer;
                height: fit-content;
                display: flex;
                z-index: 5;
            }

                .inner-short-cut
                .happines-element
                .content
                .element
                .form-element
                .input
                .faces
                .face
                img {
                    display: block;
                }

                    .inner-short-cut
                    .happines-element
                    .content
                    .element
                    .form-element
                    .input
                    .faces
                    .face
                    img:nth-child(2) {
                        display: none;
                    }

                .inner-short-cut
                .happines-element
                .content
                .element
                .form-element
                .input
                .faces
                .face:hover
                img:nth-child(1) {
                    display: none;
                }

                .inner-short-cut
                .happines-element
                .content
                .element
                .form-element
                .input
                .faces
                .face:hover
                img:nth-child(2) {
                    display: block;
                }

                .inner-short-cut
                .happines-element
                .content
                .element
                .form-element
                .input
                .faces
                .face
                input {
                    position: absolute;
                    z-index: 1;
                    top: 50%;
                    right: 50%;
                    transform: translate(50%, -50%);
                    padding: 54px;
                    width: 50px;
                    height: 29px;
                    opacity: 0;
                    cursor: pointer;
                }

                    .inner-short-cut
                    .happines-element
                    .content
                    .element
                    .form-element
                    .input
                    .faces
                    .face
                    input:checked + img:nth-child(1) {
                        display: none;
                    }

                    .inner-short-cut
                    .happines-element
                    .content
                    .element
                    .form-element
                    .input
                    .faces
                    .face
                    input:checked + img:nth-child(2) {
                        display: block;
                    }

            .inner-short-cut
            .happines-element
            .content
            .element
            .form-element
            .input
            label {
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: left;
                color: #000000;
            }

            .inner-short-cut .happines-element .content .element .form-element textarea {
                height: 190px;
                width: 100%;
                padding: 15px;
                border-radius: 10px;
                border: 1px solid #00000026;
                font-size: 16px;
                direction: ltr;
                outline: none;
            }

            .inner-short-cut
            .happines-element
            .content
            .element
            .form-element
            .submit-btns {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
            }

                .inner-short-cut
                .happines-element
                .content
                .element
                .form-element
                .submit-btns
                button:nth-child(1) {
                    width: 190px;
                    height: 45px;
                    background: var(--primary-color);
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    color: #fff;
                    border: none;
                    outline: none;
                    border-radius: 7px;
                }

                .inner-short-cut
                .happines-element
                .content
                .element
                .form-element
                .submit-btns
                button:nth-child(2) {
                    width: 147px;
                    height: 45px;
                    background: #3a3a3a;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    color: #fff;
                    border: none;
                    outline: none;
                    border-radius: 7px;
                }

        .inner-short-cut .status-element {
            width: 400px;
            height: fit-content;
            background: #faf9f8;
            border-radius: 8px;
            padding: 20px;
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-38%);
            z-index: 15;
        }

            .inner-short-cut .status-element button {
                background-color: transparent;
                outline: none;
                border: none;
            }

            .inner-short-cut .status-element .form-element {
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                gap: 15px;
            }

                .inner-short-cut .status-element .form-element label {
                    margin-top: 15px;
                    text-align: left;
                    width: 100%;
                    font-family: Tajawal;
                    font-size: 14px;
                    font-weight: 500;
                    text-align: left;
                    color: #26283b;
                    margin-bottom: 12px;
                }



    /*



   

            .inner-short-cut .status-element .form-element input {
                border: 1px solid #e8eef7;
                width: 100%;
                height: 45px;
                border-radius: 8px;
                direction: ltr;
                padding-left: 10px;
                font-size: 15px;
                color: #000;
                outline: none;
            }

            .inner-short-cut .status-element .form-element button {
                width: 155px;
                height: 40px;
                background-color: var(--primary-color) !important;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                gap: 10px;
                color: #fff;
                border-radius: 8px;
            }

.voice-search {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    z-index: 30;
    width: 100%;
    height: 100%;
    background-color: #0000008c;
    display: none;
}

    .voice-search.active {
        display: block;
    }

    .voice-search .voice-search-content {
        z-index: 1;
        position: absolute;
        right: 50%;
        top: 50%;
        transform: translate(50%, -50%);
        width: 50%;
        height: 78%;
        background-color: #000;
        border-radius: 11px;
        padding: 30px;
    }

        .voice-search .voice-search-content .content {
            display: flex;
            flex-direction: column;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            height: 100%;
        }

            .voice-search .voice-search-content .content p {
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                line-height: 25.98px;
                text-align: center;
                color: #fff;
                width: 79%;
                z-index: 1;
            }

            .voice-search .voice-search-content .content > img {
                position: absolute;
                inset: 0;
                width: 100%;
                height: 100%;
                object-fit: contain;
                display: none;
            }

                .voice-search .voice-search-content .content > img:nth-child(3) {
                    position: absolute;
                    inset: 0;
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                    display: block;
                }

            .voice-search .voice-search-content .content button {
                width: 100px;
                height: 100px;
                border-radius: 50%;
                z-index: 2;
                background-color: transparent;
                outline: none;
                border: none;
                overflow: hidden;
                position: relative;
                outline: 7px solid #37322785;
                border: 3px solid #ffffff70;
            }

                .voice-search .voice-search-content .content button img:nth-child(1) {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    scale: 1.9;
                    right: -2px;
                    position: relative;
                    display: none;
                }

                .voice-search .voice-search-content .content button img:nth-child(2) {
                    position: absolute;
                    top: 50%;
                    right: 50%;
                    transform: translate(50%, -50%);
                }

            .voice-search .voice-search-content .content > div {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                z-index: 5;
                width: 100%;
            }

            .voice-search .voice-search-content .content h2 {
                font-family: Tajawal;
                font-size: 16px;
                font-weight: 500;
                text-align: center;
                color: #fff;
                margin-top: 15px;
            }

            .voice-search .voice-search-content .content h3 {
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: center;
                color: #fff;
                width: 100%;
                text-align: left;
                margin-top: 16px;
            }

.inner-short-cut .accessibility {
    width: 400px;
    height: fit-content;
    background: #faf9f8;
    border-radius: 8px;
    padding: 20px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-73%);
    z-index: 15;
}

    .inner-short-cut .accessibility .accessibility-content .options {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
    }

        .inner-short-cut .accessibility .accessibility-content .options .option {
            width: 33%;
            padding: 10px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            height: 104px;
            margin-bottom: 7px;
        }

            .inner-short-cut .accessibility .accessibility-content .options .option.active {
                background-color: #eeeeee8a;
                border-radius: 5px;
            }

            .inner-short-cut .accessibility .accessibility-content .options .option button {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 10px;
                font-family: Tajawal;
                font-size: 10.85px;
                font-weight: 500;
                text-align: center;
                color: #363636;
            }

                .inner-short-cut
                .accessibility
                .accessibility-content
                .options
                .option
                button
                h2 {
                    font-family: Tajawal;
                    font-size: 10.85px;
                    font-weight: 500;
                    text-align: center;
                    color: #363636;
                }

    .inner-short-cut .accessibility .accessibility-content .text-options-btns {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        margin-bottom: 20px;
        margin-top: 20px;
    }

        .inner-short-cut
        .accessibility
        .accessibility-content
        .text-options-btns
        button {
            width: fit-content;
            padding-right: 20px;
            padding-left: 20px;
            height: 32px;
            font-family: Tajawal;
            font-size: 10.54px;
            font-weight: 500;
            text-align: left;
            color: #000;
            border-radius: 5px;
        }

            .inner-short-cut
            .accessibility
            .accessibility-content
            .text-options-btns
            button.active {
                background-color: var(--primary-color);
                color: #fff;
            }

    .inner-short-cut .accessibility .accessibility-content .text-options-screens {
    }

        .inner-short-cut
        .accessibility
        .accessibility-content
        .text-options-screens
        .screen {
            display: none;
            flex-direction: row;
            align-items: center;
            gap: 15px;
        }

            .inner-short-cut
            .accessibility
            .accessibility-content
            .text-options-screens
            .screen.active {
                display: flex;
            }

            .inner-short-cut
            .accessibility
            .accessibility-content
            .text-options-screens
            .screen
            img {
            }

            .inner-short-cut
            .accessibility
            .accessibility-content
            .text-options-screens
            .screen
            input {
            }

    .inner-short-cut .accessibility .accessibility-content .slider {
        -webkit-appearance: none;
        width: 100%;
        height: 5px;
        border-radius: 5px;
        background: var(--primary-color);
        outline: none;
        opacity: 0.7;
        -webkit-transition: 0.2s;
        transition: opacity 0.2s;
    }

        .inner-short-cut
        .accessibility
        .accessibility-content
        .slider::-webkit-slider-thumb {
            -webkit-appearance: none;
            appearance: none;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            background: var(--primary-color);
            cursor: pointer;
        }

        .inner-short-cut
        .accessibility
        .accessibility-content
        .slider::-moz-range-thumb {
            width: 18px;
            height: 18px;
            border-radius: 50%;
            background: var(--primary-color);
            cursor: pointer;
        }

    .inner-short-cut .accessibility .accessibility-content .sign-lang-container {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-top: 15px;
        margin-bottom: 17px;
    }

        .inner-short-cut
        .accessibility
        .accessibility-content
        .sign-lang-container
        button {
            width: 40px;
            height: 20px;
            border-radius: 50px;
            background-color: var(--primary-color);
            position: relative;
        }

            .inner-short-cut
            .accessibility
            .accessibility-content
            .sign-lang-container
            button.active {
                background-color: #eee;
            }

            .inner-short-cut
            .accessibility
            .accessibility-content
            .sign-lang-container
            button
            span {
                position: absolute;
                height: 18px;
                width: 19px;
                border-radius: 50%;
                background-color: #fff;
                left: 1px;
                top: 1px;
                transition: 0.5s;
            }

            .inner-short-cut
            .accessibility
            .accessibility-content
            .sign-lang-container
            button.active
            span {
                left: 19px;
            }

        .inner-short-cut .accessibility .accessibility-content .sign-lang-container h1 {
            font-family: Tajawal;
            font-size: 10.85px;
            font-weight: 500;
            text-align: left;
            color: #26283b;
        }

    .inner-short-cut .accessibility .accessibility-content > button {
        height: 37px;
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 15px;
        background-color: var(--primary-color);
        font-family: Tajawal;
        font-size: 10.85px;
        font-weight: 500;
        text-align: center;
        color: #fff;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
        outline: none;
        border: none;
    }
*/
    /* End ShortCuts Section */

    /* Start Police Auto talker */

    .police-auto-talker {
        position: fixed;
        bottom: 0;
        left: 6%;
        z-index: 15;
        width: 370px;
        min-height: 641px;
        border-radius: 8px 8px 0 0;
        background: #faf9f8;
        transition: 0.5s;
        display: none;
    }

        .police-auto-talker img {
            width: 50px;
            object-fit: contain;
        }

        .police-auto-talker.active {
            display: block;
        }

        .police-auto-talker.down {
            bottom: -615px;
        }

        .police-auto-talker .content {
            padding: 22px;
            height: 677px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }

            .police-auto-talker .content .header {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
                margin-bottom: 0;
            }

                .police-auto-talker .content .header .left {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    gap: 16px;
                }

                    .police-auto-talker .content .header .left button {
                        background-color: transparent;
                        outline: none;
                        border: none;
                        font-size: 18px;
                    }

                .police-auto-talker .content .header .right {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    gap: 10px;
                }

                    .police-auto-talker .content .header .right h1 {
                        font-family: Tajawal;
                        font-size: 14px;
                        font-weight: 500;
                        text-align: left;
                        color: #26283b;
                    }

            .police-auto-talker .content .body .date-time {
                font-family: Tajawal;
                font-size: 12px;
                font-weight: 500;
                text-align: right;
                color: #a3a3a3;
                text-align: center;
            }

            .police-auto-talker .content .body .messages {
                height: 480px;
                overflow-y: scroll;
                overflow-x: clip;
                padding: 20px;
            }

                .police-auto-talker .content .body .messages .receiver {
                    display: flex;
                    flex-direction: row;
                    align-items: flex-start;
                    gap: 15px;
                    margin-top: 20px;
                    margin-bottom: 20px;
                }

                    .police-auto-talker .content .body .messages .receiver .message p {
                        font-family: Tajawal;
                        font-size: 13px;
                        font-weight: 500;
                        text-align: left;
                        color: #303437;
                    }

                    .police-auto-talker .content .body .messages .receiver .message ul {
                        font-family: Tajawal;
                        font-size: 13px;
                        font-weight: 500;
                        text-align: left;
                        color: #303437;
                        margin-top: 20px;
                        margin-bottom: 20px;
                        display: flex;
                        flex-direction: column;
                        gap: 5px;
                        direction: ltr;
                    }

                        .police-auto-talker .content .body .messages .receiver .message ul li {
                            display: list-item;
                            list-style: auto;
                        }

                    .police-auto-talker .content .body .messages .receiver .message h1 {
                        font-family: Tajawal;
                        font-size: 14px;
                        font-weight: 700;
                        text-align: left;
                        color: #303437;
                    }

            .police-auto-talker .content .body .sender {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: flex-end;
                margin-bottom: 25px;
                margin-top: 25px;
            }

                .police-auto-talker .content .body .sender .message {
                    width: fit-content;
                    padding: 10px;
                    border-radius: 10px 10px 10px 0;
                    background-color: var(--primary-color);
                    color: #fff;
                }

                .police-auto-talker .content .body .sender p {
                    font-family: Tajawal;
                    font-size: 14px;
                    font-weight: 500;
                    text-align: center;
                    color: #fff;
                    margin: 0;
                }

            .police-auto-talker .content .footer {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
                width: 100%;
            }

                .police-auto-talker .content .footer button {
                    width: 44px;
                    height: 44px;
                    color: #fff;
                    background-color: var(--primary-color);
                    border: none;
                    outline: none;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    border-radius: 9px;
                }

                .police-auto-talker .content .footer input {
                    width: 271px;
                    height: 44px;
                    border: 1px solid #e3e3e3;
                    border-radius: 10px;
                    direction: ltr;
                    padding-right: 10px;
                    padding-left: 10px;
                    font-size: 16px;
                    color: #000;
                    outline: none;
                }

            .police-auto-talker .content .body .messages::-webkit-scrollbar {
                width: 0;
                border-radius: 50px;
                height: 0;
            }

            /* Track */
            .police-auto-talker .content .body .messages::-webkit-scrollbar-track {
                background: var(--primary-color);
                opacity: 0.5;
                border-radius: 50px;
                width: 0;
                border-radius: 50px;
                height: 0;
            }

            /* Handle */
            .police-auto-talker .content .body .messages::-webkit-scrollbar-thumb {
                background: var(--primary-color);
                border-radius: 50px;
                width: 0;
                border-radius: 50px;
                height: 0;
            }

                /* Handle on hover */
                .police-auto-talker .content .body .messages::-webkit-scrollbar-thumb:hover {
                    background: var(--primary-color);
                    border-radius: 50px;
                    width: 0;
                    border-radius: 50px;
                    height: 0;
                }
    /* End Police Auto talker */

    /* Tour Styles */

    .introjs-tooltiptext {
        text-align: left;
    }

    a.introjs-button.introjs-skipbutton.introjs-donebutton {
        background-color: #fff;
        outline: none;
        border: none;
        text-shadow: none;
        background-image: none;
        color: #fff;
        background-color: var(--secondary-color);
    }

    a.introjs-button.introjs-nextbutton {
        background-color: #fff;
        outline: none;
        border: none;
        text-shadow: none;
        background-image: none;
        color: #fff;
        background-color: var(--secondary-color);
    }

    a.introjs-button.introjs-skipbutton {
        background-color: #fff;
        outline: none;
        border: none;
        text-shadow: none;
        background-image: none;
        color: #fff;
        background-color: var(--secondary-color);
    }

    a.introjs-button.introjs-prevbutton {
        background-color: #fff;
        outline: none;
        border: none;
        text-shadow: none;
        background-image: none;
        color: #fff;
        background-color: var(--secondary-color);
    }

    span.introjs-helperNumberLayer {
        background: var(--secondary-color);
    }

    /* Tour Styles */

    /* Start Media Quires */
    /* here */
    @media (max-width: 950px) {
        .upper-nav .upper-nav-content .logo img {
            width: 129px;
            height: 38px;
            object-fit: contain;
        }

        /*.upper-nav .upper-nav-content {
        flex-direction: column;
    }*/

        /*nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(2) {
        display: none;
    }

    nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(3) {
        display: none;
    }

    nav .nav-content .nav-elements:nth-child(2) .nav-element:nth-child(1) {
        display: none;
    }

    nav .nav-content .nav-elements:nth-child(2) .nav-element:nth-child(2) {
        display: none;
    }*/

        .page-header .page-header-content {
            flex-direction: column;
        }

            .page-header .page-header-content img {
                width: 100%;
                height: 168px;
                object-fit: contain;
                margin-top: 16px;
                margin-bottom: 15px;
            }

            .page-header .page-header-content .page-header-info h1 {
                font-size: 21px;
            }

        .three-d-open-data .header .search {
            flex-direction: column;
        }

            .three-d-open-data .header .search button {
                width: 100%;
                height: 55px;
                background: var(--primary-color);
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                border-radius: 0 8px 8px 0;
                outline: none;
                border: none;
                border-radius: 0;
                margin-bottom: 15px;
            }

            .three-d-open-data .header .search .custom-date-input input:nth-child(2) {
                width: 100%;
                height: 70px;
                border-radius: 8px;
                border: 1px solid #e8eef7;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                direction: ltr;
                margin-bottom: 18px;
            }

            .three-d-open-data .header .search .custom-date-input {
                width: 100%;
                position: relative;
                direction: ltr;
            }

        .three-d-open-data .header .search {
            display: flex;
            flex-direction: column-reverse;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 40px;
            background-color: #f5f7fa;
            border: 2px solid #e8eef7;
            border-radius: 8px;
        }

            .three-d-open-data .header .search > select {
                width: 100%;
                height: 55px;
                margin-bottom: 19px;
                outline: none;
                border: none;
                padding: 15px;
                text-align: left;
                font-size: 16px;
                color: #000;
                direction: ltr;
            }

        .three-d-open-data .open-data-stats .stats-header {
            display: flex;
            flex-direction: column-reverse;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 34px;
        }

            .three-d-open-data .open-data-stats .stats-header h1 {
                font-family: Tajawal;
                font-size: 18px;
                font-weight: 700;
                text-align: left;
                color: #26283b;
                margin-bottom: 27px;
            }

        .comments .comments-form .inputs {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            gap: 20px;
            margin-top: 33px;
        }

        .rate-content .rate-content-options .options {
            display: flex;
            /* Modefied by Yosef on 24-4-2025 */
            flex-direction: row-reverse;
            align-items: center;
            gap: 25px;
            margin-top: 24px;
        }

        footer .upper-footer-content {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            padding-bottom: 15px;
            border-bottom: 1px solid #e5eaf2;
            padding-top: 15px;
            position: relative;
            z-index: 5;
        }

            footer .upper-footer-content ul {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 5px;
                margin: 0;
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 13px;
                flex-wrap: wrap;
                justify-content: flex-end;
                margin-top: 18px;
            }

        footer .lower-footer-content {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            padding-top: 15px;
            padding-bottom: 15px;
            position: relative;
            z-index: 5;
        }

            footer .lower-footer-content ul {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 5px;
                margin: 0;
                flex-wrap: wrap;
                justify-content: flex-end;
                margin-top: 19px;
            }

        .copy-right .copy-right-content {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            min-height: 55px;
            padding-top: 15px;
            padding-bottom: 15px;
            gap: 11px;
        }

        footer .curve-2 img {
            position: absolute;
            bottom: 0;
            width: 100%;
            top: -22px;
            right: 0;
            left: 0;
            z-index: 2;
            background-color: transparent;
        }

        footer .curve-1 img {
            width: 100%;
            top: -23px;
            position: absolute;
            left: 0;
            z-index: 1;
        }



        .advice-page .advice-header .search input,
        .questionnaires-page .questionnaires-header .search input {
            width: 100%;
            height: 65px;
            border-radius: 8px 0 0 8px;
            border: 1px solid #d4dde9;
            padding-right: 20px;
            padding-left: 20px;
            direction: ltr;
        }

        .advice-page .advice-header,
        .questionnaires-page .questionnaires-header {
            margin-bottom: 50px;
            margin-top: 50px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
        }

            .advice-page .advice-header .search,
            .questionnaires-page .questionnaires-header .search {
                position: relative;
                display: flex;
                flex-direction: row;
                align-items: center;
                width: 100%;
                margin-bottom: 18px;
            }

            .advice-page .advice-header .btns,
            .questionnaires-page .questionnaires-header .btns {
                height: 65px;
                border: 1px solid #d4dde9;
                border-radius: 8px;
                overflow: hidden;
                display: flex;
                flex-direction: column;
                width: 100%;
            }

            .advice-page .advice-header .btns,
            .questionnaires-page .questionnaires-header .btns {
                height: 152px;
                border: 1px solid #d4dde9;
                border-radius: 8px;
                overflow: hidden;
                display: flex;
                flex-direction: column;
                width: 100%;
            }

                .advice-page .advice-header .btns button,
                .questionnaires-page .questionnaires-header .btns button {
                    width: 100%;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    color: #000;
                    font-family: Tajawal;
                    font-size: 15px;
                    font-weight: 700;
                    text-align: center;
                    background-color: transparent;
                    outline: none;
                    border: none;
                    height: 50px;
                }

        .rate-content .rate-content-options {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
        }

        .advice-inner-page .header h3 {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            font-size: 15px;
            width: 100%;
            justify-content: center;
            margin-top: 17px;
            margin-bottom: 28px;
        }

        /*        .speeds-page .header .search {
            display: flex;
            flex-direction: column-reverse;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 40px;
            background-color: #f5f7fa;
            border: 2px solid #e8eef7;
            border-radius: 8px;
        }*/

        /*            .speeds-page .header .search > input {
                width: 100%;
                height: 61px;
                border-radius: 10px 0 0 10px;
                outline: none;
                border: none;
                padding: 15px;
                text-align: left;
                font-size: 16px;
                color: #000;
            }*/

        .speeds-page .header .search > select {
            width: 100%;
            height: 50px;
            border-radius: 10px 0 0 10px;
            outline: none;
            border: none;
            padding: 15px;
            text-align: left;
            font-size: 16px;
            color: #000;
            direction: ltr;
        }

        .speeds-page .header .search .custom-date-input input:nth-child(2) {
            width: 100%;
            height: 56px;
            border-radius: 8px;
            border: 1px solid #e8eef7;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            direction: ltr;
        }

        .speeds-page .header .search .custom-date-input {
            width: 100%;
            position: relative;
            direction: ltr;
        }

        /*.speeds-page .header .search {
            display: flex;
            flex-direction: column-reverse;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 40px;
            background-color: #f5f7fa;
            border: 2px solid #e8eef7;
            border-radius: 8px;
            gap: 13px;
        }*/

        /*         .speeds-page .header .search button {
                width: 100%;
                height: 60px;
                background: var(--primary-color);
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                border-radius: 0 8px 8px 0;
                outline: none;
                border: none;
                border-radius: 0;
            }*/

        .inner-page .inner-text {
            margin: 0;
            margin-top: -60px;
            background-color: #fff;
            position: relative;
            padding: 20px;
            border-radius: 10px;
            border: 1px solid #eaeaea;
        }

        .dates-toggle-btns {
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            height: fit-content;
            border: 2px solid #e8eef7;
            border-radius: 8px;
            margin-top: 25px;
            margin-bottom: 28px;
            border-radius: 8px;
            overflow: hidden;
        }

            .dates-toggle-btns .months button {
                width: 150px;
                height: 63px;
                border: none;
                outline: none;
                background-color: transparent;
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: center;
                color: #000000;
            }

        .dates-toggle-btns {
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            height: fit-content;
            border: 2px solid #e8eef7;
            border-radius: 8px;
            margin-top: 25px;
            margin-bottom: 28px;
            border-radius: 8px;
            overflow: hidden;
            overflow-x: scroll;
        }

            .dates-toggle-btns .months {
                display: flex;
                flex-direction: row;
                align-items: center;
                width: 1300px;
            }

        .blog-page .blog-item {
            width: 100%;
            min-height: 465px;
            position: relative;
            margin-right: 0;
            margin-left: 0;
            margin: 0;
            margin-bottom: 60px;
        }

        .contact-us-page .contact-options .option {
            min-height: 182px;
            width: 100%;
            border: 1px solid #d4dde9;
            box-shadow: 0px 0px 14px 0px #00000008;
            border-radius: 8px;
            padding: 13px 27px;
            margin-bottom: 28px;
        }

        /*    .contact-us-page .contact-us-footer .left {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
    }*/

        /*    .contact-us-page .contact-us-footer .right {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 8px;
    }*/

        /*  .contact-us-page .police-stations .stations .station {
        width: 50%;
        margin-bottom: 40px;
        margin-top: 40px;
        height: 150px;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        padding: 50px;
        padding-bottom: 20px;
        padding-top: 20px;
        padding: 14px;*/
    }

    .event-inner-page .event-text {
        margin: 0;
        margin-top: -60px;
        background-color: #fff;
        position: relative;
        padding: 20px;
        border-radius: 10px;
        border: 1px solid #eaeaea;
    }

        .event-inner-page .event-text .header {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 20px;
            gap: 29px;
        }

    .events-page .events-dates-toggle-btns .months {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
        width: 1300px;
    }

    .events-page .events-dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        height: 63px;
        border: 2px solid #e8eef7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
        overflow-x: scroll;
    }

    .events-page .events-dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        height: fit-content;
        border: 2px solid #e8eef7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
        overflow-x: scroll;
    }

    .events-page .event-item {
        width: 100%;
        min-height: 400px;
        position: relative;
        margin-right: 40px;
        margin-left: 27px;
        margin: 0;
        margin-bottom: 30px;
    }

    .faqs .faqs-content .question .head h1 {
        font-size: 15px;
        font-weight: 700;
        text-align: left;
        color: #26283b;
        margin-right: 17px;
    }

    .history-page .history {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        gap: 30px;
        margin-bottom: 60px;
    }

    .news-moving-slider .news-moving-content h2 {
        width: 30%;
    }

    .landing .landing-content .toggle-screen-btns button {
        font-size: 13px;
    }

    .landing .screens .screen .new-about-police .images-slider {
        height: auto;
    }

        .landing .screens .screen .new-about-police .images-slider .slide {
            height: 244px;
        }

    .landing .screens .screen .new-about-police {
        height: 261px;
    }

    .services-header {
        margin-top: 50px;
        margin-bottom: 30px;
    }

        .services-header .service-header-content {
            display: flex;
            flex-direction: column-reverse;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 30px;
            gap: 17px;
        }

            .services-header .service-header-content .options {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 18px;
                flex-wrap: nowrap;
                justify-content: space-between;
            }

        .services-header .toggle-services-categories-btns {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            justify-content: space-between;
            gap: 1px;
            flex-wrap: wrap;
        }

    .services
    .services-categories
    .category
    .category-services-slider
    .slide
    .service {
        width: 100%;
    }

    .landing .screens .screen .our-services .landing-services-search .input {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 380px;
        height: 57px;
        position: relative;
    }

    .landing .screens .screen .our-services .landing-services-search a {
        width: 229px;
        height: 57px;
        background-color: var(--primary-color);
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        color: #fff;
        border-radius: 43px;
        font-size: 14px;
    }

    /*    .landing
    .screens
    .screen
    .our-services
    .landing-services
    .services-slider
    .slide
    .service {
        width: 350px;
        min-height: 200px;
        background-color: #fff;
        border-radius: 8px;
        padding: 28px 28px 28px 28px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin-right: 0;
        gap: 18px;
        margin-right: 15px;
        margin-left: 3px;
    }*/

    /*.laws-and-legistations .laws-content .laws-search {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #e8eef7;
        border-radius: 8px;
    }*/

.landing .screens .screen .our-services .identity-number-search .input {
    position: relative;
    width: 370px;
    height: 50px;
    margin: 15px !important;
}

    .landing .screens .screen .our-services .identity-number-search {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
        margin-top: 35px;
    }

    .landing .screens .screen .last-news .all-news .news-slider .slide .blog {
        width: 100%;
        min-height: 465px;
        position: relative;
        margin-right: 0;
        margin-left: 0;
    }

    .landing .screens .screen .support-help .options {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        position: relative;
        gap: 0px;
        width: 100%;
        justify-content: space-between;
    }

        .landing .screens .screen .support-help .options a {
            width: 48%;
        }

        .landing .screens .screen .support-help .options a {
            width: 48%;
            margin-bottom: 18px;
        }

            .landing .screens .screen .support-help .options a .option h1 {
                font-weight: 500;
                font-size: 17px;
                text-align: left;
                width: 100%;
                color: #26283b;
            }

    .landing .screens .screen .support-help {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 844px;
    }

        .landing .screens .screen .support-help .ask-question input {
            width: 98%;
            height: 57px;
            border-radius: 50px;
            color: #000;
            border: 1px solid #c8d7ee;
            padding-left: 10px;
            direction: ltr;
            font-size: 15px;
            outline: none;
            padding-left: 27px;
            padding-right: 35px;
        }

        .landing .screens .screen .support-help .ask-question {
            position: relative;
            margin-top: 35px;
            display: flex;
            flex-direction: row;
            align-items: center;
            width: 100%;
            justify-content: center;
            gap: 15px;
            margin-bottom: 35px;
        }

    .landing .screens .screen .last-news .all-news .news-slider {
        position: relative;
        width: 100%;
        height: fit-content;
    }

        .landing .screens .screen .last-news .all-news .news-slider .slide .blog {
            width: 350px;
            min-height: 465px;
            position: relative;
            margin-right: 0;
            margin-left: 0;
        }

        .landing .screens .screen .last-news .all-news .news-slider .slide .blog {
            width: 100%;
            min-height: 465px;
            position: relative;
            margin-right: 0;
            margin-left: 0;
        }

    .laws-and-legistations .laws-content .laws-search > input {
        width: 100%;
    }

    .laws-and-legistations .laws-content .laws-search .custom-date-input {
        width: 100%;
        position: relative;
        direction: ltr;
        height: 65px;
    }

        .laws-and-legistations
        .laws-content
        .laws-search
        .custom-date-input
        input:nth-child(2) {
            width: 100%;
            height: 62px;
            border-radius: 8px;
            border: 1px solid #e8eef7;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            direction: ltr;
        }

    /*.laws-and-legistations .laws-content .laws-search {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #e8eef7;
        border-radius: 8px;
        padding-top: 52px;
    }*/

    /* .laws-and-legistations .laws-content .laws-search button {
            width: 100%;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 0 8px 8px 0;
            outline: none;
            border: none;
            border-radius: 0;
            margin-top: 22px;
        }*/

    .laws-and-legistations .laws-content .laws-search > label {
        font-size: 15px;
        font-weight: 500;
        text-align: left;
        color: #26293e;
        margin-top: 30px;
        margin-bottom: 10px;
    }

    .page-header .page-header-content .page-header-info ul {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 10px;
        justify-content: flex-start;
        text-align: left;
        flex-wrap: wrap;
        direction: rtl;
    }

        .page-header .page-header-content .page-header-info ul li {
            direction: ltr;
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            gap: 5px;
        }

    .news-inner-page .news-text {
        /* Modefied by Yosef on 24-4-2025 */
        margin: auto;
        background-color: #fff;
        position: relative;
        padding: 20px;
        border-radius: 10px;
        border: 1px solid #eaeaea;
    }

        .news-inner-page .news-text .header .options a {
            width: 145px;
        }

    .news-page .news-categories-toggle-btns {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        border-radius: 8px;
        overflow-x: scroll;
        direction: ltr;
    }

        .news-page .news-categories-toggle-btns .btns {
            width: 1200px;
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            height: 63px;
            border: 2px solid #e8eef7;
            border-radius: 8px;
            direction: rtl;
        }

            .news-page .news-categories-toggle-btns .btns button {
                width: 130px;
                height: 63px;
                border: none;
                outline: none;
                background-color: transparent;
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: center;
                color: #000000;
            }

        .news-page .news-categories-toggle-btns .search button {
            border-radius: 8px 0px 0px 8px;
        }

    .news-page .news-dates-toggle-btns .months button {
        width: 103px;
        height: 63px;
        border: none;
        outline: none;
        background-color: transparent;
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        text-align: center;
        color: #000000;
        margin-left: 18px;
        margin-right: 14px;
    }

    .news-page .news-dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        height: 63px;
        border: 2px solid #e8eef7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
        overflow-x: scroll;
        direction: ltr;
    }

    .news-page .news-item {
        width: 100%;
        min-height: 465px;
        position: relative;
        margin-right: 0;
        margin-left: 0;
    }

    .data-form-content .data-form .inputs {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 20px;
    }

    .organization-page .organization .line-hor {
        display: none;
    }

    .organization-page .organization .line-ver {
        display: none;
    }

    .polls-page .polls-header {
        margin-bottom: 50px;
        margin-top: 50px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
    }

        .polls-page .polls-header .search {
            position: relative;
            display: flex;
            flex-direction: row;
            align-items: center;
            width: 100%;
            margin-bottom: 17px;
        }

            .polls-page .polls-header .search input {
                width: 100%;
                height: 65px;
                border-radius: 8px 0 0 8px;
                border: 1px solid #d4dde9;
                padding-right: 20px;
                padding-left: 20px;
                direction: ltr;
            }

    .polls-page .form-element .options button:nth-child(1) {
        width: 164px;
        height: 45px;
        border-radius: 8px;
        background-color: var(--primary-color);
        color: #fff;
        outline: none;
        border: none;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: center;
        gap: 15px;
    }

    .polls-page .poll-results {
        height: fit-content;
        border-radius: 10px;
        padding: 30px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 26px;
        border: 1px solid #d4dde9;
    }

        .polls-page .poll-results .result h2 {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: left;
            width: 42%;
        }

    /*.publications-page .header .search {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #e8eef7;
        border-radius: 8px;
        padding-top: 27px;
        padding-bottom: 27px;
    }*/

    .publications-page .header .search .custom-date-input {
        width: 100%;
        position: relative;
        direction: ltr;
    }

    .publications-page .header .search > input {
        width: 100%;
        height: 65px;
        border-radius: 10px 0 0 10px;
        outline: none;
        border: none;
        padding: 15px;
        text-align: left;
        font-size: 16px;
        color: #000;
    }

    .publications-page .header .search .custom-date-input input:nth-child(2) {
        width: 100%;
        height: 68px;
        border-radius: 8px;
        border: 1px solid #e8eef7;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        direction: ltr;
        margin-bottom: 18px;
        margin-top: 18px;
    }

    /* .publications-page .header .search button {
            width: 100%;
            height: 56px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 0 8px 8px 0;
            outline: none;
            border: none;
            border-radius: 0;
        }*/

    .publication-sub-page .publication-dates-toggle-btns .months button {
        width: 150px;
        height: 63px;
        border: none;
        outline: none;
        background-color: transparent;
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        text-align: center;
        color: #000000;
    }

    .publication-sub-page .publication-dates-toggle-btns .months {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 1300px;
    }

    .publication-sub-page .publication-dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        height: 63px;
        border: 2px solid #e8eef7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
        overflow-x: scroll;
    }

    .publication-sub-page .publication-item {
        width: 100%;
        min-height: 610px;
        position: relative;
        margin-right: 0;
        margin-left: 0;
    }

    .questionnaires-inner .questionnaires-inner-content h1 {
        font-family: Tajawal;
        font-size: 19px;
        font-weight: 700;
        text-align: left;
        color: #000000;
        margin-bottom: 60px;
    }

    .service-apply .service-apply-options {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
        margin-top: 25px;
        margin-bottom: 25px;
        /*flex-wrap: wrap;*/
    }

    .service-apply .apply-service-form .inputs .normal-input div {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
        margin-bottom: 19px;
    }

    .service-cataloge-page .services-cataloge-search {
        width: 100%;
        overflow-x: scroll;
    }

        .service-cataloge-page .services-cataloge-search .sub-services-toggle-btns {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            width: 1300px;
        }

            .service-cataloge-page
            .services-cataloge-search
            .sub-services-toggle-btns
            button {
                height: 65px;
                background-color: #fff;
                color: #000;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 700;
                text-align: center;
                width: 100%;
                border: none;
                outline: none;
                width: 192px;
            }

        .service-cataloge-page .services-cataloge-search > button {
            width: 60px;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 0 8px 8px 0;
            outline: none;
            border: none;
            padding-left: 40px;
            padding-right: 40px;
        }

    .service-cataloge-page .sub-services-screens .screen a {
        width: 49%;
    }

    .service-details .service-details-options {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
        margin-top: 25px;
        margin-bottom: 25px;
    }

    .services-page .services-content a {
        width: 49%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin-bottom: 25px;
        margin-top: 25px;
        padding: 15px;
    }

    .support-form .support-form-content .data-form .inputs {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 20px;
        margin-bottom: 16px;
    }

    .voice-search .voice-search-content .content {
        display: flex;
        flex-direction: column;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        height: 100%;
    }

        .voice-search .voice-search-content .content p {
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            line-height: 22.98px;
            text-align: center;
            color: #fff;
            width: 100%;
            z-index: 1;
        }

    .voice-search .voice-search-content {
        z-index: 1;
        position: absolute;
        right: 50%;
        top: 50%;
        transform: translate(50%, -50%);
        width: 100%;
        height: 58%;
        background-color: #000;
        border-radius: 11px;
        padding: 30px;
    }

    .select2 {
        width: 100% !important;
        height: 44px;
        border-radius: 8px;
        border: 1px solid #e8eef7;
        direction: ltr;
    }

    .advice-inner-page .header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 32px;
        flex-wrap: wrap;
    }

    .contact-us-page .police-stations .stations .station > div {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-around;
        width: 100%;
    }

    .services-header .toggle-services-categories-btns-container {
        width: 100%;
        /*        overflow-x: scroll;*/
        direction: ltr;
    }

    .services-header .toggle-services-categories-btns {
        width: fit-content;
    }

        .services-header .toggle-services-categories-btns button {
            min-width: fit-content;
            font-size: 14px;
            padding-right: 15px;
            padding-left: 15px;
        }

    /*    .overview-page .text ul li {
        width: 100%;
        margin-bottom: 15px;
    }*/

    .services-header .toggle-screen-btns-container {
        width: 100%;
        /*overflow-x: scroll;*/
        direction: ltr;
    }

    .contact-us-page .police-stations .toggle-police-stations-container {
        width: 100%;
        direction: rtl;
    }

    .contact-us-page .police-stations .toggle-police-stations-categories-btns {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-around !important;
        gap: 20px;
        overflow: hidden;
    }

    .contact-us-page .police-stations button {
        background-color: transparent;
        height: 54px;
        font-size: 15px;
        font-weight: 600;
        text-align: center;
        color: rgb(38, 41, 62);
        outline: none;
        border-width: initial;
        border-style: none;
        border-color: initial;
        border-image: initial;
        padding: 8px 6px;
        transition: 0.5s;
    }

    .services-header .toggle-services-categories-btns {
        width: fit-content;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        direction: ltr;
    }

    .side-nav {
        width: calc(100% - 50px);
    }

    .new-page .select2 {
        width: 77px !important;
        height: 44px;
        border-radius: 8px;
        border: 1px solid #e8eef7;
        direction: ltr;
    }

    .contact-us-page .police-stations .stations .station .locations-popup {
        display: none;
        position: fixed;
        background-color: #fff;
        width: 98%;
        z-index: 2;
        padding: 15px;
        border-radius: 10px;
        border: 1px solid #00000017;
        transition: 0.6s;
        right: 50%;
        top: 50%;
        transform: translate(50%, -50%);
        border: 1px solid #00000059;
    }

    /* Modefied by Yosef on 24-4-2025 */
    .contact-us-page .contact-us-footer {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
    }
    /*
        .contact-us-page .contact-us-footer .left {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
        }*/

    /*        .contact-us-page .contact-us-footer .right {
            display: flex;
            flex-direction: row;
            align-items: flex-end;
            gap: 8px;
            margin-top: 46px;
        }*/

    .landing .screens .screen .our-services {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-height: 500px;
        margin-bottom: 15px;
    }

        .landing .screens .screen .our-services > h1 {
            position: relative;
            font-weight: 700;
            font-size: 20px;
            text-align: center;
            margin-top: 37px;
        }

        /*        .landing
        .screens
        .screen
        .our-services
        .landing-services
        .services-slider
        .slide
        .service {
            width: 92%;
            margin-bottom: 26px;
            margin-right: 0;
            margin-left: 0;
        }*/

        .landing
        .screens
        .screen
        .our-services
        .landing-services
        .services-slider
        .slide {
            margin-right: 0;
            margin-left: 0;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
        }

    .slick-track {
        position: inherit !important;
    }

    .landing .screens .screen .support-help .options a {
        width: 49%;
    }

    nav .nav-content .nav-elements .nav-element > a:nth-child(1):not(.home) {
        max-width: 230px !important;
    }
}
/* here */

/* Ar Styles */

.publications-page .row {
    direction: ltr;
}

/* Google transalte  */

.goog-te-gadget img {
    vertical-align: middle;
    border: none;
    display: none !important;
}

.goog-te-gadget-simple .VIpgJd-ZVi9od-xl07Ob-lTBxed span {
    border-right: 0 !important;
}

.goog-te-gadget-simple {
    background-color: #fff;
    border-right: 1px solid #d5d5d5;
    border-top: 1px solid #9b9b9b;
    border-bottom: 1px solid #e8e8e8;
    border-left: 1px solid #d5d5d5;
    font-size: 10pt;
    display: inline-block;
    padding-top: 1px;
    padding-bottom: 2px;
    cursor: pointer;
    width: 100% !important;
    height: 45px !important;
    border-radius: 5px !important;
    border: 1px solid #e0e0e0 !important;
    padding: 11px !important;
}

    .goog-te-gadget-simple .VIpgJd-ZVi9od-xl07Ob-lTBxed {
        color: #000;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

.VIpgJd-ZVi9od-xl07Ob-OEVmcd {
    z-index: 10000002;
    border: none;
    position: fixed;
    box-shadow: 0 3px 8px 2px #999;
    width: 311px !important;
    box-shadow: none !important;
}

.VIpgJd-ZVi9od-vH1Gmf {
    background-color: #fff;
    text-decoration: none;
    border: 1px solid #6b90da;
    overflow: hidden;
    padding: 4px;
    width: 100% !important;
}

.VIpgJd-ZVi9od-vH1Gmf {
    background-color: #fff;
    text-decoration: none;
    border: 1px solid #6b90da;
    overflow: hidden;
    padding: 4px;
    width: 100% !important;
    border: none;
    box-shadow: none !important;
    border: 1px solid #e3e3e3 !important;
    border-radius: 6px !important;
}

.VIpgJd-ZVi9od-vH1Gmf-ibnC6b div,
.VIpgJd-ZVi9od-vH1Gmf-ibnC6b:link div,
.VIpgJd-ZVi9od-vH1Gmf-ibnC6b:visited div,
.VIpgJd-ZVi9od-vH1Gmf-ibnC6b:active div {
    color: #000 !important;
    background: #fff;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
}

a.VIpgJd-ZVi9od-vH1Gmf-ibnC6b {
    transition: 0.5s;
}

    a.VIpgJd-ZVi9od-vH1Gmf-ibnC6b:hover {
        background-color: var(--primary-color) !important;
    }

.VIpgJd-ZVi9od-vH1Gmf-ibnC6b div,
.VIpgJd-ZVi9od-vH1Gmf-ibnC6b:link div,
.VIpgJd-ZVi9od-vH1Gmf-ibnC6b:visited div,
.VIpgJd-ZVi9od-vH1Gmf-ibnC6b:active div {
    color: #000 !important;
    background: #fff;
}

/* Modal Styles */
.modal {
    display: none;
    position: fixed;
    z-index: 1;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.4);
    padding-top: 60px;
    z-index: 100000;
}

.modal-content {
    background-color: #fefefe;
    margin: 5% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 325px;
}

    .modal-content h2 {
        text-align: center;
        font-size: 21px;
        font-weight: 500;
        margin-bottom: 30px;
    }

    .modal-content p {
        text-align: left;
        font-size: 18px;
        font-weight: 500;
        margin-bottom: 44px;
    }

    .modal-content .btns {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
        justify-content: space-between;
    }

        .modal-content .btns button {
            width: 110px;
            height: 44px;
            border: none;
            outline: none;
            border-radius: 8px;
            background-color: transparent;
            outline: none;
            font-size: 17px;
        }

            .modal-content .btns button:nth-child(1) {
                background-color: #494334;
                color: #fff;
            }

            .modal-content .btns button:nth-child(2) {
                background-color: #000;
                color: #fff;
            }

.share-buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
}

    .share-buttons a {
        margin: 10px;
        display: inline-block;
        background-color: #eee;
        width: 100%;
        height: 40px;
        border-radius: 22px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        color: #000;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding-left: 16px;
    }

    .share-buttons img {
        width: 24px;
        height: 24px;
    }

.close {
    color: #aaa;
    float: left;
    font-size: 28px;
    font-weight: bold;
}

    .close:hover,
    .close:focus {
        color: black;
        text-decoration: none;
        cursor: pointer;
    }

/* Special */

.service-apply .apply-service-form .input-auth .input > div {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 15px;
    margin-top: 10px;
    justify-content: space-between;
    width: 100%;
    border: none;
}

    .service-apply
    .apply-service-form
    .input-auth
    .input > div > div:not(.ajax__calendar) {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 15px;
        margin-top: 10px;
        justify-content: space-between;
        width: 100%;
        border: none;
    }

#ctl00_ContentPlaceHolder1_ctl41 div {
    margin: 0 !important;
    padding: 0 !important;
}

.RadMap .k-marker::before {
    position: absolute;
    display: block;
    width: 1em;
    height: 1em;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    line-height: 1;
    overflow: hidden;
    font-family: WebComponentsIcons, monospace;
    font-size: 28px;
    text-indent: 0;
    text-align: center;
    color: #000;
    margin: auto;
    position: relative;
    right: 50% !important;
    top: 50% !important;
    transform: translate(50%, -50%) !important;
}

.RadComboBox_Default .rcbInner {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: #fff !important;
    border-radius: 3px !important;
    width: 97% !important;
    height: 52px !important;
    border: 1.46px solid #dae2ee !important;
    outline: none !important;
    color: #000 !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    padding: 7px !important;
    direction: ltr !important;
    border: none !important;
    width: 100% !important;
}

.RadComboBox .rcbInner {
    padding: 4px 10px 4px 2em !important;
    border-width: 1px !important;
    border-style: solid !important;
    background-repeat: repeat-x !important;
    background-position: 0 0 !important;
    display: flex !important;
    position: relative !important;
    /* Modefied by Yosef on 21-4-2025 */
    flex-direction: row-reverse !important;
    align-items: center !important;
    gap: 5px !important;
    border: 1px solid #d7d7d7 !important;
}

.RadComboBox_Default .rcbActionButton {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: #e6e6e6 !important;
    background-image: linear-gradient(white, #e6e6e6) !important;
    border-radius: 3px 0 0 3px !important;
}

.RadComboBox .rcbActionButton {
    padding: 4px !important;
    width: 1.42857143em !important;
    height: 1.42857143em !important;
    color: inherit !important;
    border-width: 0 1px 0 0 !important;
    border-style: solid !important;
    box-sizing: content-box !important;
    background-color: transparent !important;
    background-repeat: repeat-x !important;
    background-position: 0 0 !important;
    font: inherit !important;
    position: relative !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: auto !important;
    outline: 0 !important;
    width: 45px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    outline: none !important;
}

.service-apply .apply-service-form .input-auth .input textarea {
    width: 100% !important;
    height: 170px !important;
    border: 1.46px solid #dae2ee !important;
    outline: none !important;
    color: #000 !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    padding: 7px !important;
    direction: ltr !important;
    padding-left: 15px !important;
}

span.rcbInner.rcbHovered {
    background-color: transparent !important;
    background-image: none !important;
}

.RadComboBoxDropDown .rcbItem {
    padding: 4px 10px !important;
    background-repeat: repeat-x !important;
    text-align: left !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
}

    .RadComboBoxDropDown .rcbItem > label {
        margin: -4px -10px !important;
        padding: 4px 10px !important;
        font-weight: normal !important;
        display: block !important;
        display: flex !important;
        flex-direction: row-reverse !important;
        align-items: center !important;
        justify-content: flex-end !important;
    }

input[type="button"] {
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--primary-color) !important;
    border-radius: 8px !important;
    height: 58px !important;
    color: #fff !important;
    gap: 15px !important;
    font-family: Tajawal !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    text-align: center !important;
    color: #ffffff !important;
    color: #fff !important;
    border: none !important;
    outline: none !important;
    margin-top: 18px !important;
    width: 250px !important;
}

.RadMap .k-navigator > .k-button {
    padding: 0 !important;
    width: 18px !important;
    height: 18px !important;
    line-height: normal !important;
    border-color: transparent !important;
    border-radius: 50% !important;
    color: #fff !important;
    background: 0 !important;
    box-shadow: none !important;
    position: absolute !important;
}

.RadMap .k-zoom-control {
    margin: 14px !important;
    border-width: 0 !important;
    vertical-align: middle !important;
    display: inline-block !important;
    box-shadow: none !important;
    width: 150px !important;
    color: #000 !important;
}

    .RadMap .k-zoom-control .k-button {
        padding: 2px !important;
        width: 1.42857143em !important;
        height: 1.42857143em !important;
        box-sizing: content-box !important;
        background-color: inherit !important;
        background: inherit !important;
        color: #000 !important;
    }

.k-map .k-zoom-control .k-button {
    width: auto !important;
    height: auto !important;
}

.RadMap .k-navigator > .k-button {
    padding: 0;
    width: 18px !important;
    height: 18px !important;
    line-height: normal !important;
    border-color: transparent !important;
    border-radius: 50% !important;
    color: #fff !important;
    background: 0 !important;
    box-shadow: none !important;
    position: absolute !important;
}

.RadMap_Default .k-navigator {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.RadUpload_Default .ruSelectWrap .ruButton {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: #e6e6e6 !important;
    background-image: linear-gradient(white, #e6e6e6) !important;
    border-radius: 3px !important;
    width: 100px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--primary-color) !important;
    border-radius: 8px !important;
    height: 58px !important;
    color: #fff !important;
    gap: 15px !important;
    font-family: Tajawal !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    text-align: center !important;
    color: #ffffff !important;
    height: 41px !important;
}

.RadUpload_Default .ruSelectWrap .ruFakeInput {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: #fff !important;
    width: 100% !important;
    height: 40px !important;
    border-radius: 5px !important;
    border: 1px solid #dfdfdf !important;
}

.RadUpload .ruFileWrap.ruStyled {
    display: inline-block !important;
    overflow: hidden !important;
    padding-bottom: 0.5px !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
}

.RadUpload_Default .ruDropZone {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: #e6e6e6 !important;
    border-radius: 3px !important;
    margin-top: 57px !important !important;
    position: relative !important;
    width: 100% !important;
    height: 150px !important;
    background-color: transparent !important;
    border: 3px dotted #d6d6d6 !important;
}

.RadUpload .ruInputs {
    margin: 0 !important;
    padding: 0;
    list-style-type: none !important;
    width: 100% !important;
}

.RadComboBox_Default .rcbReadOnly {
    border-color: #b3b3b3;
    color: #333;
    background-color: #e6e6e6;
    /* Modefied by Yosef on 24-4-2025 */
    background-image: linear-gradient(white, #e6e6e6);
}

.RadUpload .ruSelectWrap {
    display: inline-block !important;
    width: 100% !important;
}

.RadUpload_Default .ruDropZone {
    border-color: #b3b3b3;
    color: #333;
    background-color: #e6e6e6;
    border-radius: 3px;
    margin-top: 31px !important;
    border-radius: 26px !important;
}

.service-apply .apply-service-form .input-auth .input > div {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 15px;
    margin-top: 10px;
    justify-content: space-between;
    width: 100%;
    border: none;
}

    .service-apply
    .apply-service-form
    .input-auth
    .input > div > div:not(.ajax__calendar) {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 15px;
        margin-top: 10px;
        justify-content: space-between;
        width: 100%;
        border: none;
    }

.RadComboBoxDropDown_Default .rcbHovered {
    color: #000;
    background-color: #c2c2c2;
    text-align: left !important;
}

#tidio-chat {
    display: none;
}

.share-link {
    margin-top: 15px;
    width: 100%;
    position: relative;
}

    .share-link input {
        width: 100%;
        height: 40px;
        border-radius: 50px;
        border: none;
        outline: none;
        background-color: transparent;
        border: 1px solid #0000002b;
        padding-right: 10px;
    }

    .share-link button {
        position: absolute;
        left: 5px;
        top: 18%;
        transform: translateX(50%);
        border: none;
        outline: none;
        background-color: transparent;
        font-size: 22px;
        z-index: 1;
        background-color: #fff;
        height: 71%;
        left: -6px;
        top: 4px;
    }

.icon {
    transition: 0.2s;
    filter: opacity(1);
    scale: 1;
}

/*    .icon img:hover {
        background: rgba(255, 255, 255, 0.05) !important;
        box-shadow: 0 5px 12px rgba(0, 0, 0, 0.55) !important;
    }*/

.valid {
    border: 1px solid #4caf50;
    border-radius: 5px;
}

.valid {
    border: 1px solid #4caf50 !important;
    border-radius: 5px !important;
}

.invalid {
    border: 1px solid #f44336 !important;
    border-radius: 5px !important;
}

.RadSearchBox_Silk .rsbInner {
    border-color: #c4c4c4;
    color: #3b3b3b;
    background-color: var(--secondary-color) !important;
    border: none !important;
    outline: none !important;
    color: #fff !important;
    direction: ltr !important;
}

.RadSearchBox .rsbInput {
    height: 1.42857143em;
    margin: 3px 0.25em;
    padding: 0;
    padding-left: 0px;
    width: 100%;
    border: 0;
    color: inherit;
    background: 0;
    font: inherit;
    font-style: inherit;
    font-size: inherit;
    display: inline-block;
    vertical-align: middle;
    direction: ltr !important;
    height: 30px !important;
    padding-left: 8px !important;
    font-size: 14px !important;
}

.rsbPopup .rsbListItem {
    *zoom: 1;
    margin: 0;
    padding: 4px 10px;
    min-height: 1em;
    text-align: left !important;
}

.speeds-table .icon {
    width: 30px;
    height: 30px;
    object-fit: cover;
    background: none !important;
}

/* English Css */

nav.en {
    direction: ltr;
}

    nav.en .nav-content {
        direction: ltr;
    }

        nav.en .nav-content .nav-elements .nav-element > a {
            text-align: right;
            direction: rtl;
            direction: rtl;
        }

        nav.en .nav-content .nav-elements .nav-element .search-input {
            direction: rtl;
            direction: rtl;
        }

.side-nav.en.active {
    right: 0;
    direction: rtl;
}

.side-nav.en {
    right: -1000px;
    direction: rtl;
}

    .side-nav.en .side-nav-content > button {
        left: -40px;
        right: inherit;
        border-radius: 6px 0px 0px 6px;
        direction: rtl;
    }

nav.en
.nav-content
.nav-elements
.nav-element
#langs-menu
.langs-menu-content
h4 {
    text-align: right;
    direction: rtl;
}

nav.en
.nav-content
.nav-elements
.nav-element
#langs-menu
.langs-menu-content
select {
    direction: rtl;
    direction: rtl;
}

.page-header.en {
    direction: ltr;
}

.three-d-open-data.en .header .search {
    direction: ltr;
}

    .three-d-open-data.en .header .search > label {
        text-align: right;
        direction: rtl;
    }

.three-d-open-data.en .open-data-stats .stats-header {
    direction: ltr;
}

.inputs.en .input {
    direction: ltr;
}

nav.en .nav-content .nav-elements {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    direction: ltr;
}

.en i.la-angle-left,
.en i.la-angle-right {
    transform: rotate(180deg);
}

.page-header.en .page-header-content .page-header-info ul {
    direction: rtl;
}

.advice-page.en .advice-header .search input,
.questionnaires-page.en .questionnaires-header .search input {
    direction: rtl;
}

.advice-page.en .advice .options button,
.questionnaires-page.en .questionnair .options button {
    width: 153px;
}

.advice-page.en .advice h1,
.questionnaires-page.en .questionnair h1 {
    text-align: right;
}

.page-header.en .page-header-content .page-header-info h1 {
    text-align: right;
}

.advice-inner-page.en .advice-text {
    direction: rtl;
}

.content-table.en table tr {
    direction: ltr;
    text-align: right;
}

    .content-table.en table tr td h4 {
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        text-align: left;
        color: #26283b;
        text-align: right;
        direction: rtl;
        line-height: 27px;
    }

.page-header.en .page-header-content .page-header-info ul {
    flex-direction: row;
}

.inner-page.en .inner-text h2 {
    direction: rtl;
    text-align: right;
}

.inner-page.en .inner-text p {
    direction: rtl;
    text-align: right;
}

/*.en.years {
    position: relative;
    height: 152px;
}*/

.blog-page.en .blog-item .text h1 {
    text-align: right;
}

.contact-us-page.en .contact-options .option h3 {
    text-align: right;
}

.contact-us-page.en .contact-options .option h2 {
    text-align: right;
}

.contact-us-page.en .police-stations .stations .station h2 {
    text-align: right;
}

.contact-us-page.en .police-stations h1 {
    text-align: right;
}

.contact-us-page.en .contact-us-footer {
    direction: ltr;
}

.policy-page.en .policy-page-text {
    direction: rtl;
}

.event-inner-page.en .event-text h2 {
    text-align: right;
}

.event-inner-page.en .event-text p {
    text-align: right;
}

.events-page.en .event-item .text {
    direction: ltr;
}

.en i.la-arrow-left,
.en i.la-arrow-right {
    transform: rotate(180deg);
}

.faqs.en .faqs-content .question .head {
    direction: ltr;
}

    .faqs.en .faqs-content .question .head h1 {
        direction: rtl;
    }

.faqs.en .faqs-content .question .body p {
    direction: rtl;
    text-align: right;
}

.faqs.en .faqs-content .question .body .form-element {
    direction: rtl;
}

.faqs.en .faqs-content .question .body label {
    text-align: right;
    width: 100%;
}

.faqs.en .faqs-content .question .body textarea {
    text-align: right;
}

.en input {
    padding-left: 15px !important;
    text-align: right !important;
    padding-right: 10px !important;
    direction: rtl !important;
}

.commander-talk.en .text {
    color: #26283b;
    direction: rtl;
    text-align: right;
}

    .commander-talk.en .text h2 {
        text-align: right;
    }

    .commander-talk.en .text h1 {
        text-align: right;
    }

.history-page.en .history .text {
    direction: rtl;
}

.news-moving-slider.en .news-moving-content h2 {
    border-left: 2px solid #edf2f8;
    right: 0;
    left: inherit;
    border-right: inherit;
    padding-left: 10px;
    padding-right: 15px;
    width: 9%;
}

.landing.en
.screens
.screen
.our-services
.landing-services-search
.input
button {
    left: 30px;
    right: inherit;
}

.landing.en
.screens
.screen
.last-news
.all-news
.news-slider
.slide
.blog
.text
p {
    text-align: right;
}


.landing.en .screens .screen .support-help .options a .option h1 {
    text-align: right;
}

.landing.en .screens .screen .support-help .options a .option h2 {
    text-align: right;
}

.landing .screens .screen .support-help .ask-question button {
    left: 30px;
    right: inherit;
}

.services-header.en .toggle-services-categories-btns {
    direction: ltr;
}

.services.en
.services-categories
.category
.category-services-slider
.slide
.service
h1 {
    text-align: right;
}

.services.en
.services-categories
.category
.category-services-slider
.slide
.service
a {
    text-align: right;
}

.services.en
.services-categories
.category
.category-services-slider
.slide
.service {
    width: 214px;
}

.laws-and-legistations.en .laws-content .law {
    direction: ltr;
}

    .laws-and-legistations.en .laws-content .law h1 {
        text-align: right;
    }

.container.en .row {
    flex-direction: row;
}

.media-page.en .media-item .text h1 {
    text-align: right;
}

.news-inner-page.en .news-text p {
    text-align: right;
    direction: rtl;
}

.news-inner-page.en .news-text h2 {
    direction: rtl;
    text-align: right;
}

.news-page.en .news-item .text p {
    text-align: right;
}

.en label {
    direction: rtl !important;
}

.en textarea {
    padding-left: 15px !important;
    text-align: right !important;
    padding-right: 10px !important;
    direction: rtl !important;
}

.en select {
    padding-left: 15px !important;
    text-align: right !important;
    padding-right: 10px !important;
    direction: rtl !important;
}

.organization-page.en .organization h2 {
    text-align: right;
}

.overview-page.en .text h1 {
    text-align: right;
    width: 100%;
}

.overview-page.en .text p {
    text-align: right;
    direction: rtl;
}

.polls-page.en .form-element {
    direction: rtl;
}

.polls-page.en .polls-content {
    direction: rtl;
}

.polls-page.en .poll-results .result h2 {
    text-align: right;
}

.publication-sub-page.en .publication-item .text p {
    text-align: right;
}

.questionnaires-inner.en .questionnaires-inner-content {
    direction: rtl;
}

    .questionnaires-inner.en .questionnaires-inner-content .inputs h2 {
        text-align: right;
        direction: rtl;
    }

.inputs.en .input {
    direction: rtl;
}

.input > label {
    /* text-align: right !important;*/
    width: 90% !important;
}

.service-apply.en .apply-service-form .inputs label {
    text-align: right;
}

.service-apply.en .apply-service-form .upload-input > label {
    text-align: right;
}

.service-apply.en .service-details-header {
    direction: ltr;
    text-align: right;
}

    .service-apply.en .service-details-header div h1 {
        text-align: right;
    }

    .service-apply.en .service-details-header div h2 {
        text-align: right;
    }

.service-details.en .service-description {
    text-align: right;
    direction: ltr;
}

    .service-details.en .service-description p {
        text-align: right;
        direction: rtl;
    }

.service-details.en .service-steps .step h2 {
    direction: rtl;
    text-align: right;
}

.service-details.en .service-steps > h1 {
    text-align: right;
}

.service-details.en .service-details .detail {
    direction: ltr;
    text-align: right;
}

    .service-details.en .service-details .detail div h2 {
        text-align: right;
    }

    .service-details.en .service-details .detail div h1 {
        text-align: right;
    }

    .service-details.en .service-details .detail div ul li {
        direction: rtl;
        text-align: right;
    }

.content-table.en table tr th {
    text-align: right;
}

.content-table.en table tr td h2 {
    text-align: right;
}

.support-form.en .support-form-content .data-form .upload-input label {
    text-align: right;
}

.usage-analytics-page.en h1 {
    text-align: right;
}

.services-header.en .service-header-content {
    flex-direction: row-reverse;
}

    .services-header.en .service-header-content .options .input button {
        right: inherit;
        left: 15px;
    }

.services.en .services-categories .normal-eles {
    flex-direction: row;
}

footer.en .upper-footer-content {
    flex-direction: row-reverse;
}

footer.en .lower-footer-content {
    flex-direction: row-reverse;
}

    footer.en .lower-footer-content .clients-stats .stat div h3 {
        text-align: right;
    }

.side-nav.en .side-nav-content .main-menu > li > button {
    flex-direction: row-reverse;
}

.side-nav.en .side-nav-content .main-menu .sub-menu ul li a {
    flex-direction: row-reverse;
}

.side-nav.en .side-nav-content .main-menu > li a {
    flex-direction: row-reverse;
    text-align: right;
}

.side-nav.en .side-nav-content .main-menu > li .menu-links-options > a {
    text-align: right;
    align-items: flex-start;
}

.side-nav.en .side-nav-content .main-menu > li .menu-links-options .option {
    flex-direction: row-reverse;
}

.overview-page.en .text ul li {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 7px;
}

.overview-page.en .text ul.one-col li {
    width: 100%;
    margin-bottom: 15px;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 15px;
    justify-content: flex-start;
    text-align: right;
}

footer li {
    transition: 0.5s !important;
    scale: 1;
}

    footer li:hover {
        scale: 1.1;
    }

.page img {
    max-width: 100%;
    object-fit: cover;
    /*height: 100%;*/
    border-radius: 15px;
}

.sitemap {
    padding: 0 200px;
    border-radius: 8px;
    font-family: Arial, sans-serif;
    direction: ltr; /* Right-to-left alignment */
}

    .sitemap .row {
        display: flex;
        flex-wrap: wrap;
    }

    .sitemap .col-md-3 {
        padding: 15px;
        flex: 1 1 25%; /* Four columns per row */
        max-width: 25%;
        box-sizing: border-box;
    }

    .sitemap .col-xs-12 {
        width: 100%;
    }

    .sitemap h3 {
        font-size: 18px;
        color: #333;
        margin-bottom: 10px;
        font-weight: bold;
    }

        .sitemap h3 a {
            color: #333;
            text-decoration: none;
        }

            .sitemap h3 a:hover {
                color: #007bff;
            }

    .sitemap ul {
        list-style: none;
        padding: 0;
    }

        .sitemap ul li {
            margin-bottom: 8px;
        }

            .sitemap ul li a {
                color: #555;
                text-decoration: none;
                font-size: 14px;
            }

                .sitemap ul li a:hover {
                    color: #007bff;
                    text-decoration: underline;
                }

/* Responsive styles */
@media (max-width: 768px) {
    .sitemap .col-md-3 {
        flex: 1 1 50%; /* Two columns per row on smaller screens */
        max-width: 50%;
    }

    .sitemap {
        padding: 0 50px;
    }
}

@media (max-width: 576px) {
    .sitemap .col-md-3 {
        flex: 1 1 100%; /* Full width for mobile */
        max-width: 100%;
    }

    .sitemap {
        padding: 0 20px;
    }
}

/* Popup container */
.popup {
    position: fixed;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    background-color: white;
    padding: 0;
    border: 1px solid #ccc;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    display: none;
    z-index: 1000;
    width: 98%;
    height: 80%;
}

/* Overlay for the popup */
.overlay {
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    z-index: 999;
}

/* Close button inside the popup */
.close-popup-btn {
    background-color: #f44336;
    color: white;
    border: none;
    padding: 8px 12px;
    cursor: pointer;
    position: absolute;
    top: 10px;
    left: 10px;
}

/* Styles for the iframe */
.popup iframe {
    width: 100%;
    height: 100%;
    border: none;
}

img[src*="statcounter.com"], iframe[src*="statcounter.com"] {
    display: none !important;
}



/*//old menu */


.upper-nav .upper-nav-content {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    min-height: 58px;
    padding-top: 11px;
    padding-bottom: 11px;
}


    .upper-nav .upper-nav-content .logo {
        display: flex;
        flex-direction: row;
        gap: 26px;
    }

        .upper-nav .upper-nav-content .logo img {
            width: 185px;
            height: 59px;
            object-fit: contain;
        }



/* End Upper Nav Styles */
/* Start Navbar Styles */

nav {
    background-color: var(--primary-color);
    transition: 0.5s;
    width: 100%;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 15000;
}

nav .nav-content {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    height: 63px;
}

    nav .nav-content .nav-elements {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
    }

        nav .nav-content .nav-elements .nav-element {
            border-radius: 8px;
            padding: 5px 17px 5px 17px;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 10px;
            background-color: var(--secondary-color);
            height: 45px;
            position: relative;
        }

            nav .nav-content .nav-elements .nav-element > a {
                color: #fff;
                font-weight: 500;
                font-size: 13px;
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 6px;
            }

                nav .nav-content .nav-elements .nav-element > a:nth-child(1) i {
                    font-size: 18px;
                }

        nav .nav-content .nav-elements:nth-child(2) .nav-element:nth-child(3) {
            padding: 0;
        }

            nav .nav-content .nav-elements:nth-child(2) .nav-element:nth-child(3) button {
                width: 50px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                height: 100%;
            }

                nav .nav-content .nav-elements:nth-child(2) .nav-element:nth-child(3) button img {
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                    width: 25px;
                }


        nav .nav-content .nav-elements .nav-element > a:nth-child(1):not(.home) {
            height: 34px;
            width: 175px;
            background-color: var(--primary-color);
            border-radius: 5px;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            color: #000;
            padding: 5px;
            justify-content: center;
            font-size: 10px;
            font-weight: 600;
            text-wrap: nowrap;
            color: #fff;
        }

        nav .nav-content .nav-elements .nav-element > button {
            background-color: transparent;
            outline: none;
            border: none;
            color: #fff;
            display: flex;
            align-items: center;
            gap: 10px;
            font-weight: 500;
            font-size: 14px;
        }

            nav .nav-content .nav-elements .nav-element > button img {
                width: 100%;
                height: 100%;
                object-fit: contain;
            }

        nav .nav-content .nav-elements .nav-element .toggle-menu {
            display: none;
        }



        nav .nav-content .nav-elements .nav-element #langs-menu {
            display: block;
            position: absolute;
            border-radius: 9px;
            padding: 15px;
            width: 343px;
            min-height: 257px;
            background-color: #fff;
            z-index: 15;
            top: 46px;
            /* left: 50%;*/
            transform: translateX(50%);
            transition: 0.5s;
            opacity: 0;
            user-select: none;
            pointer-events: none;
        }

            nav .nav-content .nav-elements .nav-element #langs-menu.active {
                opacity: 1;
                user-select: inherit;
                pointer-events: inherit;
            }



            nav .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content .langs {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
            }

                nav .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content .langs a {
                    width: 151px;
                    height: 44px;
                    border-radius: 6px;
                    padding: 2px 6px 2px 6px;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    font-weight: 500;
                    font-size: 16px;
                    line-height: 26px;
                    color: #000;
                    background-color: #E7E7E7;
                    transition: 0.5s;
                }

                    nav .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content .langs a.active {
                        background-color: var(--primary-color);
                        color: #fff;
                    }



            nav .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content h4 {
                margin-top: 30px;
                margin-bottom: 10px;
                font-size: 13px;
                font-weight: 500;
                text-align: right;
                padding-right: 2px;
            }

            nav .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content select {
                width: 100%;
                height: 46px;
                padding: 9px 8px 9px 10px;
                display: flex;
                flex-direction: row-reverse;
                align-items: center;
                justify-content: space-between;
                background-color: #fff;
                border: 1px solid #E8EEF7;
                outline: none;
                font-weight: 500;
                font-size: 14px;
                border-radius: 6px;
                direction: rtl;
            }


            nav .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content .warning-msg {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                text-align: center;
                background-color: #FFF9EF;
                border: 1px solid #C4A68F;
                min-height: 61px;
                width: 100%;
                border-radius: 6px;
                padding: 19px;
                direction: rtl;
                margin-top: 19px;
            }

                nav .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content .warning-msg p {
                    text-align: center;
                    font-weight: 500;
                    font-size: 10px;
                    color: #000;
                    margin: 0;
                }

        nav .nav-content .nav-elements .nav-element > span {
            height: 21px;
            width: 1px;
            display: flex;
            background-color: #ffffff5e;
        }


        nav .nav-content .nav-elements .nav-element .search-input {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 17px;
            height: 100%;
        }

            nav .nav-content .nav-elements .nav-element .search-input > button {
                background-color: transparent;
                outline: none;
                border: none;
                font-size: 14px;
            }


            nav .nav-content .nav-elements .nav-element .search-input > input {
                background-color: transparent;
                outline: none;
                border: none;
                color: #fff;
                text-align: right;
                color: #fff;
                font-size: 14px;
                width: 230px;
                height: 100%;
                padding-right: 10px;
            }

        nav .nav-content .nav-elements .nav-element #adv-search {
            display: block;
            position: absolute;
            border-radius: 9px;
            padding: 15px;
            width: 891px;
            min-height: 264px;
            background-color: #fff;
            z-index: 15;
            top: 46px;
            left: 50%;
            transform: translateX(-50%);
            transition: 0.5s;
            opacity: 0;
            user-select: none;
            pointer-events: none;
        }

            nav .nav-content .nav-elements .nav-element #adv-search.active {
                opacity: 1;
                user-select: inherit;
                pointer-events: inherit;
            }




            nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content {
                width: 100%;
                min-height: 230px;
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                justify-content: space-between;
            }

                nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .inputs {
                    width: 100%;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: space-between;
                    gap: 10px;
                }

                    nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .inputs .input {
                        display: flex;
                        flex-direction: column;
                        align-items: flex-end;
                        width: 100%;
                    }


                        nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .inputs .input label {
                            padding-right: 6px;
                            font-weight: 500;
                            font-size: 14px;
                            margin-top: 15px;
                            margin-bottom: 15px;
                        }

                        nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .inputs .input select {
                            width: 100%;
                            height: 52px;
                            border-radius: 8px;
                            border: 1px solid #E8EEF7;
                            outline: none;
                            padding: 9px 19px 9px 19px;
                            direction: rtl;
                            display: flex;
                            flex-direction: row-reverse;
                            align-items: center;
                            justify-content: space-between;
                        }

                        nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .inputs .input input {
                            width: 100%;
                            height: 52px;
                            border-radius: 8px;
                            border: 1px solid #E8EEF7;
                            outline: none;
                            padding: 9px 19px 9px 19px;
                            direction: rtl;
                            display: flex;
                            flex-direction: row-reverse;
                            align-items: center;
                            justify-content: space-between;
                        }

                        nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .inputs .input div {
                            display: flex;
                            flex-direction: row;
                            align-items: center;
                            gap: 10px;
                        }

                        nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .inputs .input input::placeholder {
                            color: #999292;
                        }

                        nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .inputs .input select::placeholder {
                            color: #000;
                        }

                nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .btns {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    gap: 15px;
                }

                    nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .btns button {
                        height: 38px;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                        gap: 15px;
                        border-radius: 6px;
                        border: none;
                        outline: none;
                    }

                        nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .btns button.start-adv-search {
                            width: 154px;
                            background-color: var(--primary-color);
                            color: #fff;
                        }

                        nav .nav-content .nav-elements .nav-element #adv-search .adv-search-content .btns button.clear-inputs-adv-search {
                            background-color: #e7e7e7;
                            color: #26283B;
                            width: 80px;
                        }

/*.custom-date-input {
    position: relative;
    display: inline-block;
    width: 100%;*/ /* Ensure the container takes the full width */
/*}

    .custom-date-input .actual-date-input {
        position: absolute !important;
        opacity: 0;
        width: 100%;
        height: 100%;
        cursor: pointer;
        z-index: 2;
        top: 0;
        left: 0;
    }

    .custom-date-input .date-display {
        border: 1px solid #ccc;
        padding: 8px 8px 8px 2em;*/ /* Adjust left padding to make space for the icon */
/*width: calc(100% - 30px);*/ /* Adjust the width to account for icon space, if necessary */
/*margin-left: 8px;*/ /* Space between icon and input, adjust if the icon is inside the input area */
/*position: relative;
        z-index: 1;
    }

.date-input {
    font-size: 20px;*/ /* Adjust icon size as needed */
/*position: absolute;
    left: 10px;*/ /* Adjust based on your design */
/*z-index: 3;*/ /* Ensure the icon is above the transparent input */
/*color: #999292;
}*/


/* End Navbar Styles */




















/* Start Side Nav Styles */

.side-nav {
    position: fixed;
    right: 0;
    top: 76px;
    background-color: #fff;
    height: auto;
    width: 386px;
    bottom: 0;
    z-index: 20;
    border: 1px solid #00000014;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    transition: 0.5s;
    right: -1000px;
}

    /*.side-nav.active {
        right: 0;
    }
*/

    .side-nav .side-nav-content {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        /*        height: 635px;
*/ overflow-y: scroll;
    }


        /* width */
        .side-nav .side-nav-content::-webkit-scrollbar {
            width: 0;
            height: 0;
        }

        /* Track */
        .side-nav .side-nav-content::-webkit-scrollbar-track {
            background: #f1f1f1;
            width: 0;
            height: 0;
        }

        /* Handle */
        .side-nav .side-nav-content::-webkit-scrollbar-thumb {
            background: #888;
            width: 0;
            height: 0;
        }

            /* Handle on hover */
            .side-nav .side-nav-content::-webkit-scrollbar-thumb:hover {
                background: #555;
                width: 0;
                height: 0;
            }


        .side-nav .side-nav-content > button {
            position: absolute;
            left: -40px;
            background-color: #fff;
            border: none;
            outline: none;
            border-radius: 6px 0 0 6px;
            padding: 8px 13px 8px 13px;
            width: 40px;
            height: 40px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            z-index: 19;
            border-right: 1px solid #0000000f;
            font-size: 18px;
            color: #000;
            transition: 0.5s;
        }

        .side-nav .side-nav-content .main-menu {
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 17px;
        }

            .side-nav .side-nav-content .main-menu > li {
                width: 100%;
            }

                .side-nav .side-nav-content .main-menu > li a {
                    width: 100%;
                    min-height: 37px;
                    border-radius: 5px;
                    padding: 10px 20px 10px 20px !important;
                    font-size: 15px;
                    color: #0D0D0D;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: flex-end;
                    border: none;
                    outline: none;
                    background-color: #faf9f8;
                    font-weight: 500;
                    transition: 0.5s;
                    text-align: right;
                }


                    .side-nav .side-nav-content .main-menu > li a.active {
                        background-color: var(--primary-color);
                        color: #fff;
                    }

                .side-nav .side-nav-content .main-menu > li > button {
                    width: 100%;
                    min-height: 37px;
                    border-radius: 5px;
                    padding: 10px 20px 10px 20px !important;
                    font-size: 15px;
                    color: #0D0D0D;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: space-between;
                    border: none;
                    outline: none;
                    background-color: #faf9f8;
                    font-weight: 500;
                    transition: 0.5s;
                }

                    .side-nav .side-nav-content .main-menu > li > button.active {
                        background-color: var(--primary-color);
                        color: #fff;
                    }

                    .side-nav .side-nav-content .main-menu > li > button:hover {
                        background-color: var(--primary-color);
                        color: #fff;
                    }

            .side-nav .side-nav-content .main-menu .sub-menu {
                padding: 10px;
                margin: 10px;
                display: flex;
                flex-direction: column;
                background-color: #fff;
            }



                .side-nav .side-nav-content .main-menu .sub-menu ul {
                    display: flex;
                    flex-direction: column;
                    align-items: flex-end;
                    width: 100%;
                    gap: 9px;
                }

                    .side-nav .side-nav-content .main-menu .sub-menu ul li {
                        width: 100%;
                    }

                        .side-nav .side-nav-content .main-menu .sub-menu ul li a {
                            gap: 5px;
                            display: flex;
                            flex-direction: row;
                            align-items: center;
                            width: 100%;
                            font-weight: 500;
                            font-size: 13px;
                            color: #26283B;
                            justify-content: space-between;
                            transition: 0.5s;
                            border-bottom: 1px solid transparent;
                        }

                            .side-nav .side-nav-content .main-menu .sub-menu ul li a:hover {
                                border-bottom: 1px solid var(--primary-color);
                            }



            .side-nav .side-nav-content .main-menu > li .menu-links-options {
                display: flex;
                flex-direction: column;
                align-items: flex-end;
                border: 1px solid #00000012;
                border-radius: 7px;
            }

                .side-nav .side-nav-content .main-menu > li .menu-links-options > a {
                    width: 100%;
                    height: 42px;
                    font-weight: 500;
                    font-size: 14px;
                    color: #0D0D0D;
                    padding: 10px 15px 10px 15px;
                    text-align: right;
                    display: flex;
                    flex-direction: column;
                    align-items: flex-end;
                    border: 1px solid #00000014;
                    border-top: 0;
                }

                .side-nav .side-nav-content .main-menu > li .menu-links-options .option {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: space-between;
                    width: 100%;
                    padding: 10px 15px 10px 15px;
                }

                    .side-nav .side-nav-content .main-menu > li .menu-links-options .option .switch-color-btns {
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        gap: 5px;
                    }

                        .side-nav .side-nav-content .main-menu > li .menu-links-options .option .switch-color-btns button {
                            width: 18px;
                            height: 18px;
                            border-radius: 50%;
                            border: none;
                            outline: none;
                            cursor: pointer;
                        }

                            .side-nav .side-nav-content .main-menu > li .menu-links-options .option .switch-color-btns button.switch-to-light {
                                background-color: #E1E0E0;
                            }

                            .side-nav .side-nav-content .main-menu > li .menu-links-options .option .switch-color-btns button.switch-to-dark {
                                background-color: #7A6F57;
                                border: 2px solid #000;
                            }


                    .side-nav .side-nav-content .main-menu > li .menu-links-options .option h3 {
                        font-weight: 500;
                        font-size: 14px;
                        color: #0D0D0D;
                        text-align: right;
                        margin: 0;
                    }

        .side-nav .side-nav-content .our-app {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            width: 100%;
            margin-top: 16px;
        }

            .side-nav .side-nav-content .our-app h2 {
                font-weight: 500;
                font-size: 16px;
                text-align: center;
                line-height: 23px;
            }

            .side-nav .side-nav-content .our-app .app-links {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 15px;
                flex-wrap: wrap;
                margin-top: 8px;
            }


/* End Side Nav Styles */


/* Start Moving News Slider Styles */
.news-moving-slider {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
    overflow: hidden;
    position: relative;
    direction: ltr;
}

    .news-moving-slider .news-moving-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 15px;
        height: 50px;
        position: relative;
        white-space: nowrap;
        overflow: hidden;
    }

    .news-moving-slider .moving-slider {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 10px;
        animation: slideMove 40s linear infinite;
    }

        .news-moving-slider .moving-slider .slide {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 14px;
            flex: 0 0 auto;
            min-width: 200px;
        }

            .news-moving-slider .moving-slider .slide a {
                white-space: nowrap;
                font-weight: 500;
                font-size: 14px;
                color: #26283b;
            }

            .news-moving-slider .moving-slider .slide span {
                display: flex;
                width: 1px;
                height: 13px;
                background-color: #000;
                border-radius: 5px;
            }

    .news-moving-slider .news-moving-content h2 {
        width: 7%;
        text-align: right;
        font-weight: 500;
        font-size: 15px;
        margin: 0;
        border-left: 2px solid #edf2f8;
        border-radius: 5px;
        height: 30px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        padding-left: 5px;
        background-color: #fff;
        z-index: 6;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
    }

@keyframes slideMove {
    0% {
        transform: translateX(10%); /* Change from translateX(35%) */
    }

    100% {
        transform: translateX(-100%); /* Change from translateX(-100%) */
    }
}

.moving-slider:hover,
.moving-slider2:hover {
    animation-play-state: paused;
}

/* End Moving News Slider Styles */


/* Start Landing Styles */


.landing .landing-content .toggle-screen-btns {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}


    .landing .landing-content .toggle-screen-btns button {
        width: 100%;
        height: 54px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        border: none;
        outline: none;
        color: #26283B;
        font-weight: 700;
        font-size: 14px;
        text-align: center;
        background-color: #f7f6f5;
        transition: 0.5s;
        border-right: 1px solid #0000001c;
        border-top: 1px solid #0000001c;
        scale: 1 !important;
    }


        .landing .landing-content .toggle-screen-btns button.active {
            border-radius: 5px 5px 0 0;
            border-bottom: 5px solid #5c4e2e;
            background-color: var(--primary-color);
            color: #fff;
        }

.landing .screens {
}


    .landing .screens .screen {
        height: 500px;
        position: relative;
        opacity: 0;
        user-select: none;
        pointer-events: none;
        height: 0 !important;
    }

        .landing .screens .screen.active {
            height: 500px;
            position: relative;
            opacity: 1;
            user-select: inherit;
            pointer-events: inherit;
            height: 100% !important;
        }
        /* Modefied by Yosef on 4-5-2025 */
        .landing .screens .screen .slider-center-btns {
            display: none;
        }

        .landing .screens .screen .new-about-police {
            height: 500px;
        }

            .landing .screens .screen .new-about-police .images-slider {
                height: 500px;
            }

                .landing .screens .screen .new-about-police .images-slider .slide {
                    height: 500px;
                }

                    .landing .screens .screen .new-about-police .images-slider .slide img {
                        width: 100%;
                        object-fit: fill;
                        height: 100%;
                    }


                    .landing .screens .screen .new-about-police .images-slider .slide .links {
                        position: absolute;
                        bottom: 4%;
                        left: 5%;
                        gap: 15px;
                        display: flex;
                        flex-direction: row;
                        gap: 30px;
                        z-index: 5;
                    }

                        .landing .screens .screen .new-about-police .images-slider .slide .links a {
                            display: flex;
                            flex-direction: row;
                            align-items: center;
                            justify-content: center;
                            background-color: var(--primary-color);
                            width: 150px;
                            height: 40px;
                            border-radius: 5px;
                            color: #fff;
                        }



            .landing .screens .screen .new-about-police .slider-btns {
                position: absolute;
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 15px;
                right: 20px;
                bottom: 20px;
            }

                .landing .screens .screen .new-about-police .slider-btns button {
                    width: 50px;
                    height: 50px;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    color: #fff;
                    background-color: var(--primary-color);
                    border-radius: 3px;
                    border: none;
                    outline: none;
                }

        .landing .screens .screen .our-services {
            position: relative;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 600px;
        }




            .landing .screens .screen .our-services > img {
                inset: 0;
                width: 100%;
                height: 100%;
                position: absolute;
                object-fit: cover;
            }


            .landing .screens .screen .our-services > .overlay {
            }


            .landing .screens .screen .our-services > h1 {
                position: relative;
                font-weight: 700;
                font-size: 27px;
                text-align: center;
            }


            .landing .screens .screen .our-services .landing-services-search {
                position: relative;
                margin-top: 35px;
                display: flex;
                flex-direction: row;
                align-items: center;
                width: 100%;
                justify-content: center;
                gap: 15px;
                margin-bottom: 35px;
            }



                .landing .screens .screen .our-services .landing-services-search a {
                    width: 235px;
                    height: 57px;
                    background-color: var(--primary-color);
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    color: #fff;
                    border-radius: 43px;
                }

                .landing .screens .screen .our-services .landing-services-search .input {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    width: 680px;
                    height: 57PX;
                    position: relative;
                }

                    /*                    .landing .screens .screen .our-services .landing-services-search .input input {
                        width: 100%;
                        height: 100%;
                        border-radius: 50px;
                        color: #000;
                        border: 1px solid #C8D7EE;
                        padding-right: 10px;
                        direction: rtl;
                        font-size: 15px;
                        outline: none;
                        padding-right: 27px;
                        padding-left: 35px;
                    }*/


                    .landing .screens .screen .our-services .landing-services-search .input input::placeholder {
                        color: #26293E;
                    }

                    .landing .screens .screen .our-services .landing-services-search .input button {
                        background-color: transparent;
                        outline: none;
                        border: none;
                        position: absolute;
                        left: 30px;
                        top: 50%;
                        transform: translateY(-50%);
                    }



            .landing .screens .screen .our-services .landing-services {
                position: relative;
                width: 100%;
            }


                .landing .screens .screen .our-services .landing-services .slider-btns {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%);
                    width: 107%;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: space-between;
                    padding: 15px;
                    z-index: 15;
                    height: 0;
                    padding: 0;
                }


                    .landing .screens .screen .our-services .landing-services .slider-btns button {
                        background-color: transparent;
                        outline: none;
                        border: none;
                        font-size: 72px;
                        color: var(--primary-color);
                    }

                .landing .screens .screen .our-services .landing-services .services-slider {
                    position: relative;
                    width: 100%;
                    height: 225px
                }

                    /* Modefied by Yosef on 27-4-2025 */
                    /*    .landing .screens .screen .our-services .landing-services .services-slider .slide {
                        width: fit-content !important;
                    }
*/





                    .landing .screens .screen .our-services .landing-services .services-slider .slide .service h2 {
                        text-align: center;
                        font-weight: 500;
                        font-size: 17px;
                        color: #000;
                    }

            .landing .screens .screen .our-services .identity-number-search {
                display: flex;
                flex-direction: row-reverse;
                align-items: center;
                gap: 15px;
                margin-top: 35px;
            }


                .landing .screens .screen .our-services .identity-number-search .input {
                    position: relative;
                    width: 455px;
                    height: 50px;
                }

                    .landing .screens .screen .our-services .identity-number-search .input button {
                        position: absolute;
                        /*left: 0;*/
                        height: 100%;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        gap: 15px;
                        background-color: var(--primary-color);
                        color: #fff;
                        width: 127px;
                        border-radius: 50px;
                        justify-content: center;
                        border: none;
                        outline: none;
                    }



                    .landing .screens .screen .our-services .identity-number-search .input input {
                        width: 100%;
                        background-color: #fff;
                        color: #000;
                        font-size: 16px;
                        padding-right: 20px;
                        padding-left: 130px;
                        height: 100%;
                        text-align: right;
                        border-radius: 50px;
                        border: none;
                        outline: none;
                        font-weight: 500;
                    }

                .landing .screens .screen .our-services .identity-number-search h3 {
                    font-weight: 700;
                    font-size: 16px;
                    color: #26283b;
                    margin: 0;
                }

        .landing .screens .screen .last-news {
            position: relative;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 600px;
        }

            .landing .screens .screen .last-news > img {
                inset: 0;
                width: 100%;
                height: 100%;
                position: absolute;
                object-fit: cover;
            }

            .landing .screens .screen .last-news > .overlay {
            }

            .landing .screens .screen .last-news .all-news {
                position: relative;
                width: 100%;
                height: 500px;
            }

                .landing .screens .screen .last-news .all-news .slider-btns {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%);
                    width: 107%;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: space-between;
                    padding: 15px;
                    z-index: 15;
                    height: 0;
                    padding: 0;
                }

                    .landing .screens .screen .last-news .all-news .slider-btns button {
                        background-color: transparent;
                        outline: none;
                        border: none;
                        font-size: 72px;
                        color: var(--primary-color);
                    }

                .landing .screens .screen .last-news .all-news .news-slider {
                    position: relative;
                    width: 100%;
                    height: 225px
                }


                    /*             .landing .screens .screen .last-news .all-news .news-slider .slide {
                        width: fit-content !important;
                    }*/

                    .landing .screens .screen .last-news .all-news .news-slider .slide .blog {
                        width: 364px;
                        min-height: 465px;
                        position: relative;
                        margin-left: 40px;
                        margin-right: 27px;
                    }


                        .landing .screens .screen .last-news .all-news .news-slider .slide .blog img {
                            width: 100%;
                            height: 343px;
                            border-radius: 10px;
                        }

                        .landing .screens .screen .last-news .all-news .news-slider .slide .blog .text {
                            width: 90%;
                            background-color: #fff;
                            position: absolute;
                            bottom: 34px;
                            left: 50%;
                            transform: translateX(-50%);
                            border-radius: 10px;
                            padding: 26px;
                            min-height: 170px;
                            text-align: right;
                            justify-content: space-between;
                            display: flex;
                            flex-direction: column;
                        }

                            .landing .screens .screen .last-news .all-news .news-slider .slide .blog .text h4 {
                                font-weight: 500;
                                font-size: 13px;
                                color: #808080;
                            }

                            .landing .screens .screen .last-news .all-news .news-slider .slide .blog .text p {
                                font-weight: 700;
                                font-size: 16px;
                                color: #26283b;
                            }


                            .landing .screens .screen .last-news .all-news .news-slider .slide .blog .text a {
                                font-weight: 500;
                                font-size: 13px;
                                color: #063579;
                                display: flex;
                                flex-direction: row;
                                align-items: center;
                                gap: 15px;
                            }


            .landing .screens .screen .last-news > a {
                position: relative;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                width: 309px;
                height: 46px;
                background-color: var(--primary-color);
                border-radius: 50px;
                color: #fff;
                font-weight: 500;
                font-size: 15px;
            }



        .landing .screens .screen .support-help {
            position: relative;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            height: 600px;
        }

            .landing .screens .screen .support-help > img {
                inset: 0;
                width: 100%;
                height: 100%;
                position: absolute;
                object-fit: cover;
                opacity: 0.1;
            }

            .landing .screens .screen .support-help > .overlay {
            }

            .landing .screens .screen .support-help .ask-question button {
                background-color: transparent;
                outline: none;
                border: none;
                position: absolute;
                left: 30px;
                top: 50%;
                transform: translateY(-50%);
            }



            .landing .screens .screen .support-help .ask-question {
                position: relative;
                margin-top: 35px;
                display: flex;
                flex-direction: row;
                align-items: center;
                width: 685px;
                justify-content: center;
                gap: 15px;
                margin-bottom: 35px;
            }


                .landing .screens .screen .support-help .ask-question button img {
                    filter: invert(1);
                }

                .landing .screens .screen .support-help .ask-question input {
                    width: 682px;
                    height: 57px;
                    border-radius: 50px;
                    color: #000;
                    border: 1px solid #C8D7EE;
                    padding-right: 10px;
                    direction: rtl;
                    font-size: 15px;
                    outline: none;
                    padding-right: 27px;
                    padding-left: 35px;
                }


            .landing .screens .screen .support-help .options {
                display: flex;
                flex-direction: row;
                align-items: center;
                flex-wrap: wrap;
                position: relative;
                gap: 15px;
                width: 85%;
            }

                .landing .screens .screen .support-help .options a {
                    width: 32.33%;
                }

                    .landing .screens .screen .support-help .options a .option {
                        width: 100%;
                        height: 164px;
                        border-radius: 8px;
                        display: flex;
                        flex-direction: column;
                        align-items: flex-start;
                        justify-content: space-between;
                        padding: 16px;
                        background-color: #fff;
                        border: 1px solid #e3d8cd;
                        box-shadow: 0px 0px 14px 0px #00000008;
                    }

                        .landing .screens .screen .support-help .options a .option img {
                        }

                        .landing .screens .screen .support-help .options a .option h2 {
                            font-weight: 500;
                            font-size: 12px;
                            color: #26283b;
                            width: 100%;
                            text-align: right;
                        }

                        .landing .screens .screen .support-help .options a .option h1 {
                            font-weight: 500;
                            font-size: 19px;
                            text-align: right;
                            width: 100%;
                            color: #26283b;
                        }

            .landing .screens .screen .support-help > a {
                position: relative;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                width: 309px;
                height: 46px;
                background-color: var(--primary-color);
                border-radius: 50px;
                color: #fff;
                font-weight: 500;
                font-size: 15px;
                margin-top: 50px;
            }

/* End Landing Styles */





/* Start Services Header Section */

/*.services-header {
    margin-top: 30px;
    margin-bottom: 30px;
}*/


    .services-header .service-header-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 30px;
    }

        .services-header .service-header-content .options {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 18px;
        }

.services .container .slider-buttons {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    justify-content: center;
    margin-top: 20px;
}

    .services .container .slider-buttons button {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        width: 38px;
        height: 38px;
        border-radius: 50%;
        border: 1px solid #ebeef7;
        background-color: #fff;
    }


.services-header .service-header-content .options a {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 108px;
    height: 38px;
    border-radius: 50px;
    border: 1px solid #ebeef7;
    background-color: #fff;
    font-weight: 500;
    font-size: 13px;
    color: #26293e;
}

.services-header .service-header-content .options .input {
    width: 233px;
    height: 38px;
    position: relative;
}



    .services-header .service-header-content .options .input button {
        position: absolute;
        left: 17px;
        top: 50%;
        transform: translateY(-50%);
        outline: none;
        border: none;
        background-color: transparent;
    }

        .services-header .service-header-content .options .input button img {
            width: 15px;
        }

    /*                .services-header .service-header-content .options .input input {
                    width: 100%;
                    height: 100%;
                    border-radius: 50px;
                    text-align: right;
                    padding-right: 17px;
                    padding-left: 17px;
                    outline: none;
                    border: 1px solid #e8eef7;
                }*/

    .services-header .service-header-content .options .input input::placeholder {
        color: #26293E;
    }


.services-header .service-header-content h1 {
    font-weight: 700;
    font-size: 27px;
    text-align: right;
    color: #26283b;
}


.services-header .toggle-services-categories-btns {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
}

    .services-header .toggle-services-categories-btns button {
        background-color: transparent;
        outline: none;
        border: none;
        height: 54px;
        padding: 8px 6px 8px 6px;
        font-size: 15px;
        font-weight: 600;
        text-align: center;
        color: #26293e;
        transition: 0.5s;
    }

        .services-header .toggle-services-categories-btns button.active {
            color: var(--primary-color);
            border-bottom: 6px solid var(--primary-color);
        }




/* End Services Header Section */



/* Start Services Section */

.services {
}


    .services .services-categories {
        margin-bottom: 70px;
    }


        .services .services-categories .category {
            display: none;
        }


            .services .services-categories .category.active {
                display: block;
            }


        .services .services-categories .less .slide {
            width: fit-content !important;
        }

        .services .services-categories .normal-eles {
            display: flex;
            flex-direction: row-reverse;
            gap: 15px;
            flex-wrap: wrap;
        }

        .services .services-categories .category .category-services-slider .slide .service {
            /* Modefied by Yosef on 1-5-2025 */
            width: 250px !important;
            height: 250px;
            background-color: #fff;
            border-radius: 8px;
            padding: 24px 5% 24px 5%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            border: 2px solid #E8EEF7;
            margin-top: 15px;
            margin-bottom: 15px;
        }


            .services .services-categories .category .category-services-slider .slide .service img {
            }

            .services .services-categories .category .category-services-slider .slide .service h1 {
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: right;
                width: 100%;
            }

            .services .services-categories .category .category-services-slider .slide .service div {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-between;
                width: 100%;
            }

            .services .services-categories .category .category-services-slider .slide .service a {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                width: 80px;
                height: 31px;
                font-size: 11px;
                font-weight: 500;
                text-align: right;
                background: #26283B;
                border-radius: 5px;
                color: #26283b;
            }

                .services .services-categories .category .category-services-slider .slide .service a:nth-child(1) {
                    background: #F2F6FB;
                }


                .services .services-categories .category .category-services-slider .slide .service a:nth-child(2) {
                    background: var(--primary-color);
                    color: #fff;
                }



/* End Services Section */



/* Start Clients Section */
/*
.clients {
    background-image: url('../images/clients/back.webp');
    background-image: url('../images/clients/back.webp');
    background-size: cover;
    background-position: center;
    min-height: 269px;
    padding-top: 0;
    margin-top: 0;
    background-position: top;
}

    .clients .client {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
    }

        .clients .client > img {
            width: 90px;
        }

        .clients .client a:nth-child(2) img {
            width: 35px;
        }


        .clients .client a:nth-child(3) img {
            width: 33px;
        }

        .clients .client a {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
        }


            .clients .client a img {
                width: 75%;
                height: 80px;
                object-fit: contain;
            }
*/


/* End Clients Section */


/* Start Footer Section */

footer {
    background-color: var(--primary-color);
    position: relative;
    padding-top: 15px;
}



    footer .curve-1 img {
        width: 100%;
        top: -70px;
        position: absolute;
        right: 0;
        z-index: 1;
    }

    footer .curve-2 img {
        position: absolute;
        bottom: 0;
        width: 100%;
        top: -68px;
        left: 0;
        right: 0;
        z-index: 2;
        background-color: transparent;
    }

    footer .upper-footer-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding-bottom: 15px;
        border-bottom: 1px solid #E5EAF2;
        padding-top: 15px;
        position: relative;
        z-index: 5;
    }


        footer .upper-footer-content .socials {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 10px;
        }

            footer .upper-footer-content .socials a {
                width: 30px;
                height: 30px;
                object-fit: contain;
                padding: 5px;
                background-color: var(--secondary-color);
                border-radius: 5px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                color: #fff;
                font-size: 18px;
            }

                footer .upper-footer-content .socials a img {
                    width: 25px;
                    height: 25px;
                    object-fit: contain;
                    padding: 5px;
                    background-color: var(--secondary-color);
                    border-radius: 5px;
                }

        footer .upper-footer-content ul {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            margin: 0;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 30px;
        }

            footer .upper-footer-content ul a {
                font-family: Tajawal;
                font-size: 12px;
                font-weight: 500;
                line-height: 19px;
                scale: 1;
                text-align: right;
                color: #fff;
                transition: 0.5s;
            }

                footer .upper-footer-content ul a:hover {
                    scale: 1.3 !important;
                }

    footer .lower-footer-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding-top: 35px;
        padding-bottom: 15px;
        position: relative;
        z-index: 5;
    }


        footer .lower-footer-content .clients-stats {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 20px;
        }

            footer .lower-footer-content .clients-stats .stat {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 11px;
            }



                footer .lower-footer-content .clients-stats .stat div h4 {
                    font-size: 9px;
                    color: #fff;
                    text-align: right;
                    font-weight: 500;
                    margin: 0;
                }

                footer .lower-footer-content .clients-stats .stat div h3 {
                    font-size: 14px;
                    font-weight: 500;
                    color: #fff;
                    text-align: right;
                }

                footer .lower-footer-content .clients-stats .stat img {
                    width: 30px;
                    height: 30px;
                    object-fit: contain;
                    padding: 5px;
                    background-color: var(--secondary-color);
                    border-radius: 5px;
                }

        footer .lower-footer-content ul {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            margin: 0;
        }


            footer .lower-footer-content ul li span {
                width: 1px;
                height: 14px;
                margin: 4px;
                display: flex;
                background-color: #fff;
            }

            footer .lower-footer-content ul li a {
                font-size: 12px;
                font-weight: 500;
                text-align: right;
                color: #fff;
            }



/* End Footer Section */










/* Start Copyright Section */

.copy-right {
    background-color: var(--secondary-color);
}

    .copy-right .copy-right-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        min-height: 55px;
    }

        .copy-right .copy-right-content h4 {
            font-size: 12px;
            font-weight: 500;
            text-align: center;
            color: #fff;
            margin: 0;
        }


/* End Copyright Section */



/* Start PageHeader Section*/

.page-header {
    background-color: #f7f7f7;
    margin-bottom: 20px;
}


    .page-header .page-header-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        min-height: 200px;
        background-color: #f7f7f7;
    }

        .page-header .page-header-content img {
            width: 150px;
            height: 150px;
            object-fit: contain;
        }


        .page-header .page-header-content .page-header-info h1 {
            font-size: 35px;
            font-weight: 700;
            line-height: 42px;
            text-align: right;
            color: #000;
            text-align: right;
        }

        .page-header .page-header-content .page-header-info ul {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            gap: 10px;
            justify-content: flex-start;
        }


            .page-header .page-header-content .page-header-info ul li a {
                font-size: 12px;
                font-weight: 500;
                text-align: right;
                color: #26283BCC;
            }





/* End PageHeader Section*/





/* Start support form Section*/




.support-form .support-form-content {
    width: 100%;
    /*min-height: 900px;*/
    background-color: #fff;
    border-radius: 10px;
    border: 1px solid #D4DDE9;
    padding: 25px;
}





    .support-form .support-form-content .data-form .inputs {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 20px;
    }
        /*
            .support-form .support-form-content .data-form .inputs .input {
                width: 100%;
                position: relative;
            }*/

        .support-form .support-form-content .data-form .inputs .input label {
            font-size: 16px;
            font-weight: 500;
            position: absolute;
            right: 13px;
            top: 14px;
            opacity: 1;
            user-select: inherit;
            pointer-events: inherit;
            transition: 0.3s;
        }


            .support-form .support-form-content .data-form .inputs .input label span {
                color: red;
            }


        .support-form .support-form-content .data-form .inputs .input input:focus + label {
            opacity: 0;
            user-select: none;
            pointer-events: none;
        }

        .support-form .support-form-content .data-form .inputs .input select {
            width: 100%;
            height: 52px;
            padding: 7px 20px 7px 20px;
            border: 1px solid #DAE2EE;
            border-radius: 8px;
            direction: rtl;
            outline: none;
            font-size: 16px;
            padding-left: 10px;
        }

            .support-form .support-form-content .data-form .inputs .input select:focus + label {
                opacity: 0;
                user-select: none;
                pointer-events: none;
            }


        .support-form .support-form-content .data-form .inputs .input textarea {
            width: 100%;
            height: 225px;
            padding: 7px 20px 7px 20px;
            border: 1px solid #DAE2EE;
            border-radius: 8px;
            outline: none;
            text-align: right;
            font-size: 16px;
        }

            .support-form .support-form-content .data-form .inputs .input textarea:focus + label {
                opacity: 0;
                user-select: none;
                pointer-events: none;
            }

    .support-form .support-form-content .data-form .upload-input {
        width: 100%;
    }

        .support-form .support-form-content .data-form .upload-input label {
            width: 100%;
            text-align: right;
            font-size: 16px;
            font-weight: 500;
            padding: 15px;
        }

        .support-form .support-form-content .data-form .upload-input .upload-here {
            width: 100%;
            border: 3px dotted #D4DDE9;
            border-radius: 8px;
            min-height: 200px;
            padding: 33px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-align: center;
            position: relative;
        }


            .support-form .support-form-content .data-form .upload-input .upload-here span {
                width: 56px;
                height: 56px;
                background-color: #f5f5f5;
                border-radius: 50%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                font-size: 30px;
            }


            .support-form .support-form-content .data-form .upload-input .upload-here h2 {
                font-size: 15px;
                text-align: center;
                font-weight: 700;
                color: #282828;
            }

            .support-form .support-form-content .data-form .upload-input .upload-here h3 {
                font-size: 11px;
                font-weight: 500;
                text-align: center;
                color: #282828;
            }






    .support-form .support-form-content .data-form .uploaded-files #fileList {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 15px;
        padding: 15px;
    }

        .support-form .support-form-content .data-form .uploaded-files #fileList div {
            font-size: 15px;
            background-color: #fff;
            border: 1px solid #D4DDE9;
            padding: 5px;
            border-radius: 5px;
            padding-left: 15px;
            padding-right: 15px;
        }


    .support-form .support-form-content .data-form .buttons button:nth-child(1) {
        width: 100px;
        height: 46px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        background-color: var(--primary-color);
        font-weight: 500;
        font-size: 15px;
        border-radius: 7px;
        color: #fff;
    }


    .support-form .support-form-content .data-form .buttons button:nth-child(2) {
        width: 175px;
        height: 46px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        background-color: #f5f5f5;
        font-weight: 500;
        font-size: 15px;
        border-radius: 7px;
    }



/* End  support form Section*/




/* Start Faqs Section */




.faqs .faqs-content .faqs-search {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
}

    .faqs .faqs-content .faqs-search .open-all-questions {
        width: 195px;
        height: 65px;
        border-radius: 10px;
        outline: none;
        background-color: #fff;
        border: 2px solid #E8EEF7;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        padding: 14px;
    }


        .faqs .faqs-content .faqs-search .open-all-questions span {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            font-size: 15px;
            gap: 5px;
        }

    .faqs .faqs-content .faqs-search .search {
        width: 100%;
        margin-left: 20px;
        display: flex;
        flex-direction: row;
        align-items: center;
    }


        .faqs .faqs-content .faqs-search .search button {
            width: 72px;
            height: 65px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            outline: none;
            border-radius: 10px 0 0 10px;
            background-color: var(--secondary-color);
            outline: none;
            border: none;
        }

        .faqs .faqs-content .faqs-search .search input {
            width: 100%;
            height: 65px;
            border-radius: 0 10px 10px 0;
            text-align: right;
            border: 2px solid #E8EEF7;
            padding-right: 15px;
            outline: none;
        }


.faqs .faqs-content .question {
    padding: 24px 28px 24px 28px;
    background-color: #fff;
    border: 2px solid #e8eef7;
    border-radius: 8px;
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: 0px;
    margin-bottom: 33px;
    transition: 0.5s;
}

    .faqs .faqs-content .question.active {
        gap: 23px;
        padding: 24px 28px 42px 28px;
    }





    .faqs .faqs-content .question .head {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

        .faqs .faqs-content .question .head button {
            outline: none;
            border: none;
            background-color: #f5f7fa;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            width: 41px;
            height: 39px;
            border-radius: 6px;
            color: #986F2F;
            font-size: 16px;
        }

        .faqs .faqs-content .question .head h1 {
            font-size: 20px;
            font-weight: 700;
            cursor: pointer;
            text-align: left;
            color: #26283B;
        }


    .faqs .faqs-content .question .body {
        transition: 0.5s;
        height: 0;
        overflow: hidden;
    }

    .faqs .faqs-content .question.active .body {
        height: fit-content;
    }

    .faqs .faqs-content .question .body p {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        line-height: 19px;
        text-align: right;
        direction: rtl;
    }


    .faqs .faqs-content .question .body label {
        font-size: 15px;
        font-weight: 500;
        line-height: 18px;
        text-align: right;
        color: #000000;
        margin-top: 15px;
        margin-bottom: 19px;
    }


    .faqs .faqs-content .question .body .form-element {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .faqs .faqs-content .question .body textarea {
        width: 100%;
        height: 210px;
        border-radius: 10px;
        border: 1px solid #dae2ee;
        padding: 23px;
        color: #000;
        font-size: 16px;
        text-align: right;
        outline: none;
    }

    .faqs .faqs-content .question .body button {
        width: 143px;
        height: 41px;
        background: var(--primary-color);
        outline: none;
        border: none;
        border-radius: 6px;
        color: #fff;
    }



/* End Faqs Section */



/* Start Rate Content Section */



.rate-content .rate-content-options {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

    .rate-content .rate-content-options > button {
        width: 425px;
        height: 50px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 15px;
        border-radius: 10px;
        padding: 10px 20px 10px 20px;
        background: #F5F5F5;
        outline: none;
        border: none;
        font-size: 14px;
        font-weight: 500;
        text-align: center;
        color: #26283B;
    }


    .rate-content .rate-content-options .options {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 25px;
    }

        .rate-content .rate-content-options .options button {
            width: 144px;
            height: 50px;
            border-radius: 10px;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 20px;
            background: #F5F5F5;
            font-size: 14px;
            font-weight: 500;
            text-align: center;
            align-items: center;
            justify-content: center;
            text-align: center;
            border: none;
        }

            .rate-content .rate-content-options .options button i {
                font-size: 20px;
            }



        .rate-content .rate-content-options .options h3 {
            font-size: 16px;
            font-weight: 500;
            text-align: right;
            color: #26283B;
            margin: 0;
        }

.rate-content .date-update h4 {
    font-family: Tajawal;
    font-size: 16px;
    font-weight: 500;
    text-align: left;
    color: #26283B;
}






/* End Rate Content Section */




/* Start laws-and-legistations Section */


/*.laws-and-legistations .laws-content .laws-search {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
    background-color: #f5f7fa;
    border: 2px solid #E8EEF7;
    border-radius: 8px;
}
*/

/*.laws-and-legistations .laws-content .laws-search button {
        width: 60px;
        height: 65px;
        background: var(--primary-color);
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        border-radius: 8px 0 0 8px;
        outline: none;
        border: none;
    }*/

.laws-and-legistations .laws-content .laws-search .custom-date-input {
    width: 15%;
    position: relative;
    direction: rtl;
}

    .laws-and-legistations .laws-content .laws-search .custom-date-input i {
        position: absolute;
        left: 56px;
        top: 50%;
        transform: translateY(-50%);
    }



    .laws-and-legistations .laws-content .laws-search .custom-date-input input:nth-child(2) {
        width: 147px;
        height: 44px;
        border-radius: 8px;
        border: 1px solid #e8eef7;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        direction: rtl;
    }

.laws-and-legistations .laws-content .laws-search > label {
    font-size: 15px;
    font-weight: 500;
    text-align: right;
    color: #26293E;
}

/*.laws-and-legistations .laws-content .laws-search > input {
        width: 60%;
        height: 65px;
        border-radius: 0 10px 10px 0;
        outline: none;
        border: none;
        padding: 15px;
        text-align: right;
        font-size: 16px;
        color: #000;
    }*/



.laws-and-legistations .laws-content .law {
    border: 2px solid #E8EEF7;
    min-height: 306px;
    background-color: #fff;
    padding: 24px 28px 24px 28px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 15px;
    border-radius: 8px;
    margin-bottom: 25px;
    justify-content: space-between;
}

    .laws-and-legistations .laws-content .law > img {
        width: 40px;
        height: 40px;
        object-fit: contain;
    }



    .laws-and-legistations .laws-content .law h1 {
        font-size: 17px;
        font-weight: 700;
        text-align: right;
        color: #26283B;
    }


    .laws-and-legistations .laws-content .law h3 {
        font-weight: 500;
        font-size: 13px;
        color: #777777;
        text-align: right;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 4px;
        direction: rtl;
    }

        .laws-and-legistations .laws-content .law h3 span {
            font-weight: 700;
            font-size: 13px;
            color: #777777;
            text-align: right;
        }

    .laws-and-legistations .laws-content .law div {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 15px;
    }


        .laws-and-legistations .laws-content .law div button {
            width: 20%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 6px;
            height: 40px;
            color: #fff;
            outline: none;
            border: none;
        }


        .laws-and-legistations .laws-content .law div a {
            width: 80%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 6px;
            height: 40px;
            color: #fff;
            outline: none;
            border: none;
        }


/* End laws-and-legistations Section */




/* Start Comments Section */

.comments {
    /* margin-top: 20px;
    margin-bottom: 20px;*/
}

    .comments h3 {
        text-align: center;
        text-align: center;
        font-size: 21px;
        font-weight: 500;
    }

    .comments .comments-control button {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        border-radius: 4px;
        background: #F5F7FA;
        border: none;
        outline: none;
        height: 80px;
        padding: 10px 29px 10px 29px;
        font-size: 21px;
        font-weight: 500;
        text-align: right;
    }


        .comments .comments-control button i {
            font-size: 14px;
        }

    .comments .comments-form {
        height: 0;
        overflow: hidden;
        transition: 0.5s;
    }

        .comments .comments-form.active {
            height: 100%;
        }




        .comments .comments-form .inputs {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            gap: 20px;
            margin-top: 33px;
        }

            .comments .comments-form .inputs .input {
                width: 100%;
                display: flex;
                flex-direction: column;
                align-items: initial;
                gap: 16px;
            }

                .comments .comments-form .inputs .input label {
                    font-size: 16px;
                    font-weight: 500;
                    text-align: right;
                }


                .comments .comments-form .inputs .input input {
                    border: 1px solid #DAE2EE;
                    width: 100%;
                    height: 55px;
                    padding: 25px;
                    border-radius: 10px;
                    direction: ltr;
                    outline: none;
                    font-size: 16px;
                    color: #000;
                }

                .comments .comments-form .inputs .input textarea {
                    border: 1px solid #DAE2EE;
                    width: 100%;
                    height: 190px;
                    padding: 25px;
                    border-radius: 10px;
                    direction: rtl;
                    outline: none;
                    font-size: 16px;
                    color: #000;
                }


        .comments .comments-form button {
            width: 153px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 6px;
            height: 40px;
            color: #fff;
            outline: none;
            border: none;
            margin-top: 30px;
        }





/* End Comments Section */



/* Start services-page Section */

.services-page {
}


    .services-page .services-search {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        background-color: #fff;
    }

        .services-page .services-search button {
            width: 60px;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 8px 0 0 8px;
            outline: none;
            border: none;
        }


        .services-page .services-search select {
            width: 35%;
            height: 65px;
            direction: rtl;
            border: none;
            outline: none;
            border-right: 1px solid #e8eef7;
            padding-right: 16px;
        }


        .services-page .services-search input {
            width: 60%;
            height: 65px;
            border-radius: 0 10px 10px 0;
            outline: none;
            border: none;
            padding: 15px;
            text-align: right;
            font-size: 16px;
            color: #000;
        }

        .services-page .services-search .select2-container .select2-selection--single {
            width: 100%;
            height: 100%;
            direction: rtl;
            border: none;
            outline: none;
            padding-right: 16px;
            border-radius: 0;
        }

        .services-page .services-search .select2 {
            border: none;
        }

    .services-page .service-image {
        margin-bottom: 50px;
        margin-top: 50px;
    }

        .services-page .service-image img {
            width: 100%;
            height: 450px;
            object-fit: contain;
        }


    .services-page .col-12 > h1 {
        font-family: Tajawal;
        font-size: 32px;
        font-weight: 700;
        text-align: center;
        color: #26283B;
        margin-top: 50px;
    }


    .services-page .services-content {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        justify-content: center;
        margin-bottom: 50px;
    }


        .services-page .services-content a {
            width: 33.33%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            margin-bottom: 25px;
            margin-top: 25px;
            padding: 15px;
        }


        .services-page .services-content .service {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }


            .services-page .services-content .service img {
                margin-bottom: 15px;
            }

            .services-page .services-content .service h1 {
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: center;
                color: #26283B;
                text-align: center;
            }


        .services-page .services-content button {
            margin-top: 40px;
            width: 165px;
            height: 46px;
            background: var(--primary-color);
            outline: none;
            border: none;
            color: #fff;
            border-radius: 7px;
        }



/* End services-page Section */




/* Start service-cataloge-page Section */

.service-cataloge-page {
}



    .service-cataloge-page .services-cataloge-search {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        padding: 0;
    }


        .service-cataloge-page .services-cataloge-search > button {
            width: 60px;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 8px 0 0 8px;
            outline: none;
            border: none;
        }

        .service-cataloge-page .services-cataloge-search .sub-services-toggle-btns {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            width: 100%;
        }



            .service-cataloge-page .services-cataloge-search .sub-services-toggle-btns button {
                height: 65px;
                background-color: #fff;
                color: #000;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 700;
                text-align: center;
                width: 100%;
                border: none;
                outline: none;
            }


                .service-cataloge-page .services-cataloge-search .sub-services-toggle-btns button.active {
                    border-radius: 0 6px 6px 0;
                    background: var(--primary-color);
                    color: #fff;
                }




    .service-cataloge-page .sub-services-screens {
    }

        .service-cataloge-page .sub-services-screens .screen {
            display: none;
            align-items: center;
            justify-content: flex-end;
            margin-top: 50px;
            margin-bottom: 70px;
            flex-wrap: wrap;
        }

            .service-cataloge-page .sub-services-screens .screen.active {
                display: flex;
            }



            .service-cataloge-page .sub-services-screens .screen a {
                width: 216px;
            }

                .service-cataloge-page .sub-services-screens .screen a .service {
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: space-between;
                    min-height: 194px;
                    padding: 15px;
                }


                    .service-cataloge-page .sub-services-screens .screen a .service img {
                        margin-bottom: 15px;
                    }


                    .service-cataloge-page .sub-services-screens .screen a .service h1 {
                        font-family: Tajawal;
                        font-size: 17px;
                        font-weight: 500;
                        text-align: center;
                        color: #26283B;
                        text-align: center;
                    }

            .service-cataloge-page .sub-services-screens .screen > h1 {
                font-size: 20px;
                text-align: center;
                width: 100%;
            }


/* End service-cataloge-page Section */




/* Start service-details Section */


.service-details .service-details-header {
    margin-top: 20px;
    margin-bottom: 20px;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 20px;
    direction: rtl;
}


    .service-details .service-details-header img {
        width: 76px;
        height: 76px;
        object-fit: contain;
    }

    .service-details .service-details-header h1 {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        text-align: right;
        color: #000;
    }



.service-details .service-details-options {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 25px;
    margin-bottom: 25px;
}


    .service-details .service-details-options .option {
        width: 100%;
    }


      /*  .service-details .service-details-options .option a {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 8px;
            height: 58px;
            color: #fff;
            gap: 15px;
            font-family: Tajawal;
            font-size: 15px;
            font-weight: 500;
            text-align: center;
            color: #FFFFFF;
        }
*/

        .service-details .service-details-options .option img {
            width: 20px;
            height: 20px;
            object-fit: contain;
        }


.service-details .main-image {
    width: 100%;
}

    .service-details .main-image img {
        width: 100%;
        height: 500px;
        object-fit: cover;
        border-radius: 15px;
        margin-bottom: 25px;
    }


.service-details .service-description {
    border: 2px solid #E8EEF7;
    background: #FFFFFF;
    min-height: 207px;
    padding: 24px 28px 24px 28px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 19px;
    border-radius: 8px;
    margin-bottom: 25px;
    text-align: right;
}

    .service-details .service-description h1 {
        font-family: Tajawal;
        font-size: 20px;
        font-weight: 700;
        text-align: right;
        color: #26283B;
    }

    .service-details .service-description p {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        text-align: right;
        padding: 15px;
        color: #26283B;
        direction: rtl;
    }


.service-details .service-details {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

    .service-details .service-details .detail {
        border: 1px solid #DAE2EE;
        background: #FFFFFF;
        border-radius: 10px;
        padding: 25px;
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        gap: 20px;
    }



        .service-details .service-details .detail div h1 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: right;
            color: #000000;
            margin-bottom: 11px;
        }


        .service-details .service-details .detail div h2 {
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            text-align: right;
            color: #26283B;
        }



        .service-details .service-details .detail img {
            width: 72px;
            height: 72px;
            object-fit: contain;
        }

        .service-details .service-details .detail div ul {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 5px;
        }

            .service-details .service-details .detail div ul li {
                direction: rtl;
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: right;
                color: #26283B;
            }

.service-details .service-steps {
    margin-top: 0;
    margin-bottom: 25px;
    border: 1px solid #E8EDF4;
    border-radius: 10px;
    background: #FAF9F8;
    padding: 35px;
}

    .service-details .service-steps > h1 {
        font-family: Tajawal;
        font-size: 18px;
        font-weight: 700;
        text-align: right;
        margin-bottom: 30px;
    }


    .service-details .service-steps .step {
        min-height: 101px;
        background: #FFFFFF;
        border: 1px solid #E8EDF4;
        padding: 25px;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 15px;
        border-radius: 6px;
        margin-bottom: 10px;
        direction:rtl;
    }


        .service-details .service-steps .step span {
            width: 60px;
            height: 60px;
            font-family: Tajawal;
            font-size: 27px;
            font-weight: 500;
            text-align: center;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 50%;
            color: #fff;
            margin-left: -43px;
        }


        .service-details .service-steps .step h2 {
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            text-align: right;
            color: #26283B;
            margin: 0;
            direction: rtl;
            width: 80%;
        }


/* End service-details Section */




/* Start service-apply Section */

.service-apply {
}


    .service-apply .service-details-header {
        margin-top: 25px;
        margin-bottom: 25px;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: flex-start;
        text-align: right;
        gap: 15px;
    }


        .service-apply .service-details-header img {
            width: 76px;
            height: 76px;
            object-fit: contain;
        }




        .service-apply .service-details-header div h1 {
            font-family: Tajawal;
            font-size: 26px;
            font-weight: 500;
            text-align: right;
            color: #26283B;
        }


        .service-apply .service-details-header div h2 {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            text-align: right;
            color: #000000;
        }


    .service-apply .service-apply-options {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
        margin-top: 25px;
        margin-bottom: 25px;
        direction: rtl;
    }

        .service-apply .service-apply-options .option {
            width: 100%;
        }

           /* .service-apply .service-apply-options .option a {
                width: 100%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                background: var(--primary-color);
                border-radius: 8px;
                height: 58px;
                color: #fff;
                gap: 15px;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 500;
                text-align: center;
                color: #FFFFFF;
            }
*/

                .service-apply .service-apply-options .option a img {
                    width: 20px;
                    height: 20px;
                    object-fit: contain;
                }


    .service-apply .apply-service-form {
        border: 1px solid #D4DDE9;
        background: #FFFFFF;
        border-radius: 10px;
        padding: 25px 40px;
        margin-bottom: 70px;
    }



        .service-apply .apply-service-form h4 {
            font-family: Tajawal;
            font-size: 13px;
            font-weight: 500;
            text-align: left;
            margin-bottom: 15px;
        }

        .service-apply .apply-service-form .form-element {
            width: 100%;
            display: flex;
            flex-direction: column;
            align-items: flex-end;
            gap: 10px;
        }

        .service-apply .apply-service-form .input-auth {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: flex-start;
            gap: 15px;
            justify-content: flex-end;
        }


            .service-apply .apply-service-form .input-auth .input {
                text-align: left;
                width: 100%;
                display: block;
            }

                .service-apply .apply-service-form .input-auth .input > label {
                    font-family: Tajawal;
                    font-size: 16.79px;
                    font-weight: 700;
                    text-align: right;
                    color: #26283B;
                }

                .service-apply .apply-service-form .input-auth .input > div {
                    display: flex;
                    flex-direction: row-reverse;
                    align-items: center;
                    gap: 15px;
                    margin-top: 10px;
                    justify-content: space-between;
                }

                .service-apply .apply-service-form .input-auth .input div > input {
                    width: 100%;
                    height: 52px;
                    border: 1.46px solid #DAE2EE;
                    outline: none;
                    color: #000;
                    font-size: 16px;
                    border-radius: 8px;
                    padding: 7px;
                    direction: ltr;
                }

                .service-apply .apply-service-form .input-auth .input > div > button {
                    width: 200px;
                    height: 52px;
                    border-radius: 5px;
                    text-align: center;
                    outline: none;
                    border: none;
                    color: #fff;
                    display: flex;
                    flex-direction: row-reverse;
                    align-items: center;
                    justify-content: center;
                    gap: 10px;
                    background: var(--primary-color);
                }

        .service-apply .apply-service-form > span {
            width: 48px;
            height: 48px;
            background: #F5F7FA;
            border-radius: 50%;
            font-family: Tajawal;
            font-size: 16.79px;
            font-weight: 500;
            text-align: center;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            color: #26283B;
        }


        .service-apply .apply-service-form .inputs {
            width: 100%;
            display: flex;
            flex-direction: row;
            align-items: flex-start;
            gap: 10px;
            margin-top: 25px;
            margin-bottom: 25px;
        }

            .service-apply .apply-service-form .inputs label {
                font-family: Tajawal;
                font-size: 16.79px;
                font-weight: 700;
                text-align: right;
                color: #26283B;
                width: 100%;
                margin-bottom: 15px;
            }


            .service-apply .apply-service-form .inputs .input > div {
                width: 100%;
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 15px;
            }

            .service-apply .apply-service-form .inputs .normal-input > div {
                width: 100%;
                display: flex;
                flex-direction: row-reverse;
                align-items: center;
                gap: 15px;
                margin-bottom: 19px;
            }

                .service-apply .apply-service-form .inputs .normal-input > div input {
                    width: 100%;
                    height: 52px;
                    border: 1.46px solid #DAE2EE;
                    outline: none;
                    color: #000;
                    font-size: 16px;
                    border-radius: 8px;
                    padding: 7px;
                    direction: rtl;
                }


            .service-apply .apply-service-form .inputs .normal-input {
                width: 100%;
            }

.RadComboBox_Default .rcbInner {
    border-color: #b3b3b3;
    color: #333;
    background-color: #fff;
    border-radius: 3px;
    width: 100%;
    border: none !important;
    outline: none !important;
}

.RadComboBox .rcbInput {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 1.42857143em;
    border: 0;
    box-shadow: none;
    outline: 0;
    color: inherit;
    background: 0;
    font: inherit;
    display: inline-block;
    -webkit-appearance: none;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
    width: 100%;
    height: 52px;
    border: 1.46px solid #DAE2EE;
    outline: none;
    color: #000;
    font-size: 16px;
    border-radius: 8px;
    padding: 7px;
    direction: rtl;
}


.service-apply .apply-service-form .inputs > div > input {
    width: 100%;
    height: 52px;
    border: 1.46px solid #DAE2EE;
    outline: none;
    color: #000;
    font-size: 16px;
    border-radius: 8px;
    padding: 7px;
    direction: rtl;
}





.service-apply .apply-service-form .input-auth .input > label {
    font-family: Tajawal;
    font-size: 16.79px;
    font-weight: 700;
    text-align: right;
    color: #26283B;
}


.service-apply .apply-service-form .input-auth .normal-input > label {
    font-family: Tajawal;
    font-size: 16.79px;
    font-weight: 700;
    text-align: right;
    color: #26283B;
}

.service-apply .apply-service-form .input-auth .input h3 {
    font-family: Tajawal;
    font-size: 13px;
    font-weight: 500;
    text-align: left;
    margin-bottom: 15px;
    text-align: right;
}


.service-apply .apply-service-form .input-auth .input h4 {
    margin: 0;
    display: flex;
    flex-direction: row-reverse;
    gap: 5px;
}

    .service-apply .apply-service-form .input-auth .input h4 > button {
        width: inherit;
        height: inherit;
        background-color: transparent;
        color: #000;
    }


.service-apply .apply-service-form .agreament {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: 18px;
    gap: 10px;
}

    .service-apply .apply-service-form .agreament label {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 5px;
        font-family: Tajawal;
        font-size: 13px;
        font-weight: 500;
        text-align: right;
    }

        .service-apply .apply-service-form .agreament label a {
            font-family: Tajawal;
            font-size: 13px;
            font-weight: 500;
            text-align: right;
            color: #737373;
        }


    .service-apply .apply-service-form .agreament input {
    }



.service-apply .apply-service-form .upload-input {
    width: 100%;
}

    .service-apply .apply-service-form .upload-input > label {
        width: 100%;
        text-align: right;
        font-size: 16px;
        font-weight: 500;
        padding: 15px;
    }

    .service-apply .apply-service-form .upload-input .upload-here {
        width: 100%;
        border: 3px dotted #D4DDE9;
        border-radius: 8px;
        min-height: 200px;
        padding: 33px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        position: relative;
    }


        .service-apply .apply-service-form .upload-input .upload-here > span {
            width: 56px;
            height: 56px;
            background-color: #f5f5f5;
            border-radius: 50%;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            font-size: 30px;
        }


        .service-apply .apply-service-form .upload-input .upload-here h2 {
            font-size: 15px;
            text-align: center;
            font-weight: 700;
            color: #282828;
        }

        .service-apply .apply-service-form .upload-input .upload-here h3 {
            font-size: 11px;
            font-weight: 500;
            text-align: center;
            color: #282828;
        }






.service-apply .apply-service-form .uploaded-files #fileList {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
    padding: 15px;
}

    .service-apply .apply-service-form .uploaded-files #fileList div {
        font-size: 15px;
        background-color: #fff;
        border: 1px solid #D4DDE9;
        padding: 5px;
        border-radius: 5px;
        padding-left: 15px;
        padding-right: 15px;
    }

.service-apply .apply-service-form .buttons {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
    width: 100%;
}


    .service-apply .apply-service-form .buttons > button:nth-child(1) {
        width: 175px;
        height: 46px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        background-color: var(--primary-color);
        font-weight: 500;
        font-size: 15px;
        border-radius: 7px;
        color: #fff;
    }


    .service-apply .apply-service-form .buttons > button:nth-child(2) {
        width: 175px;
        height: 46px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        background-color: #f5f5f5;
        font-weight: 500;
        font-size: 15px;
        border-radius: 7px;
    }



/* End service-apply Section */



/* Start contact-us-page Section */


.contact-us-page {
}


    .contact-us-page .contact-options {
        display: flex;
        flex-direction: row;
        align-items: center;
        /*justify-content: space-between;*/
        flex-wrap: wrap;
        margin-bottom: 80px;
    }

        .contact-us-page .contact-options .option {
            min-height: 182px;
            width: 241px;
            border: 1px solid #D4DDE9;
            box-shadow: 0px 0px 14px 0px #00000008;
            border-radius: 8px;
            padding: 13px 27px;
            margin-bottom: 15px;
        }

            .contact-us-page .contact-options .option a {
                height: 182px;
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                justify-content: center;
            }

            .contact-us-page .contact-options .option img {
                width: 72px;
                height: 72px;
                object-fit: contain;
                margin-bottom: 26px;
            }


            .contact-us-page .contact-options .option h3 {
                font-family: Tajawal;
                font-size: 12px;
                font-weight: 500;
                text-align: right;
                color: #26283B;
                width: 100%;
            }

            .contact-us-page .contact-options .option h2 {
                font-family: Tajawal;
                font-size: 19px;
                font-weight: 700;
                text-align: right;
                color: #26283B;
                width: 100%;
            }

    .contact-us-page .contact-page-map {
    }


        .contact-us-page .contact-page-map .search {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 15px;
            width: 100%;
            position: relative;
            margin-bottom: 40px;
        }

            .contact-us-page .contact-page-map .search button {
                background-color: transparent;
                outline: none;
                border: none;
                filter: invert(1);
                position: absolute;
                left: 12px;
            }

            .contact-us-page .contact-page-map .search input {
                height: 48px;
                border-radius: 58px;
                border: 1px solid #D4DDE9;
                width: 100%;
                text-align: right;
                padding-left: 20px;
                padding-right: 20px;
            }


    .contact-us-page .police-stations {
    }

        .contact-us-page .police-stations h1 {
            font-family: Tajawal;
            font-size: 22px;
            font-weight: 700;
            text-align: right;
            color: #26283B;
            margin-bottom: 40px;
        }

        .contact-us-page .police-stations .stations {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
            /* direction: rtl;*/
        }


            /*.contact-us-page .police-stations .stations .station {*/
            /* width: 50%;*/
            /*margin-bottom: 40px;
                margin-top: 40px;
                height: 150px;
                justify-content: space-between;
                display: flex;
                flex-direction: column;
                align-items: flex-end;
                padding: 2%;
                padding-bottom: 48px;
                padding-top: 10px;
                margin-top: 0;
            }*/


            .contact-us-page .police-stations .stations .station h2 {
                font-family: Tajawal;
                font-size: 15px;
                font-weight: bold;
                text-align: right;
                color: #000;
            }


            .contact-us-page .police-stations .stations .station > div {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: space-around;
                width: 100%;
            }


                .contact-us-page .police-stations .stations .station > div > a {
                }



                .contact-us-page .police-stations .stations .station > div > button {
                    background-color: transparent;
                    outline: none;
                    border: none;
                }


            .contact-us-page .police-stations .stations .station .locations-popup {
                display: none;
                position: absolute;
                background-color: #fff;
                width: 350px;
                z-index: 2;
                padding: 15px;
                border-radius: 10px;
                border: 1px solid #00000017;
                transition: 0.6s;
            }

                .contact-us-page .police-stations .stations .station .locations-popup.active {
                    display: block !important;
                }

                .contact-us-page .police-stations .stations .station .locations-popup .header {
                    /* Modefied by Yosef on 28-4-2025 */
                    /*border-bottom: 1px solid #E9EDF3;*/
                    display: flex;
                    flex-direction: row-reverse;
                    align-items: center;
                    justify-content: space-between;
                }

                    .contact-us-page .police-stations .stations .station .locations-popup .header button {
                        background-color: transparent;
                        outline: none;
                        border: none;
                        font-size: 24px;
                    }




                .contact-us-page .police-stations .stations .station .locations-popup ul li {
                    width: 100%;
                    border-bottom: 1px solid #E9EDF3;
                    height: 60px;
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: flex-end;
                }

                    .contact-us-page .police-stations .stations .station .locations-popup ul li a {
                        font-family: Tajawal;
                        font-size: 17.99px;
                        font-weight: 500;
                        text-align: right;
                        /* Modefied by Yosef on 28-4-2025 */
                        color: #dbc4ab;
                        display: flex;
                        flex-direction: row-reverse;
                        align-items: center;
                        gap: 10px;
                    }

                        .contact-us-page .police-stations .stations .station .locations-popup ul li a i {
                            width: 36px;
                            height: 36px;
                            /* Modefied by Yosef on 28-4-2025 */
                            /*background: #F5F7FA;*/
                            display: flex;
                            flex-direction: row;
                            align-items: center;
                            justify-content: center;
                            border-radius: 50%;
                        }


                .contact-us-page .police-stations .stations .station .locations-popup h4 {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: flex-end;
                }


                    .contact-us-page .police-stations .stations .station .locations-popup h4 span {
                        font-family: Tajawal;
                        font-size: 16px;
                        font-weight: 500;
                        text-align: right;
                        color: #26283B;
                    }


                    .contact-us-page .police-stations .stations .station .locations-popup h4 i {
                        width: 36px;
                        height: 36px;
                        background: #F5F7FA;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                        border-radius: 50%;
                    }

                .contact-us-page .police-stations .stations .station .locations-popup .all-locations {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    flex-wrap: wrap;
                    gap: 4px;
                    justify-content: flex-end;
                    padding-bottom: 5%;
                    border-bottom: 1px solid #e9edf3;
                }


                    .contact-us-page .police-stations .stations .station .locations-popup .all-locations span {
                        padding: 5px;
                        display: flex;
                        flex-direction: row;
                        align-items: center;
                        justify-content: center;
                        border-radius: 50px;
                        background-color: #eee;
                        width: fit-content;
                        padding-left: 15px;
                        padding-right: 15px;
                    }

    .contact-us-page .contact-us-footer {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }


        .contact-us-page .contact-us-footer .left {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
        }



            .contact-us-page .contact-us-footer .left a {
            }

                .contact-us-page .contact-us-footer .left a img {
                }

            .contact-us-page .contact-us-footer .left h2 {
                font-family: Tajawal;
                font-size: 16px;
                font-weight: 500;
                text-align: right;
                color: #1C1E2E;
            }

        .contact-us-page .contact-us-footer .right {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 8px;
        }


            .contact-us-page .contact-us-footer .right a {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                width: 48px;
                height: 48px;
                border-radius: 10px;
                background: var(--primary-color);
                color: #fff;
                font-size: 29px;
            }


            .contact-us-page .contact-us-footer .right img {
            }

            .contact-us-page .contact-us-footer .right h2 {
                font-family: Tajawal;
                font-size: 16px;
                font-weight: 500;
                text-align: right;
                color: #1C1E2E;
                margin-left: 17px;
            }

.all-services {
    direction: ltr;
    padding: 1.5%;
    overflow-wrap: break-word;
}
/* End contact-us-page Section */




/* Start News Page Styles */




.news-page .news-categories-toggle-btns {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    border-radius: 8px;
    overflow: hidden;
}




    .news-page .news-categories-toggle-btns .search button {
        background-color: transparent;
        outline: none;
        border: none;
        width: 72px;
        height: 63px;
        background: var(--primary-color);
        border-radius: 8px 0 0 8px;
    }


    .news-page .news-categories-toggle-btns .btns {
        width: 100%;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        height: 63px;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
    }


        .news-page .news-categories-toggle-btns .btns button {
            width: 100%;
            height: 63px;
            border: none;
            outline: none;
            background-color: transparent;
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: center;
            color: #000000;
        }


            .news-page .news-categories-toggle-btns .btns button.active {
                border-radius: 0 8px 8px 0;
                background: var(--primary-color);
                color: #fff;
            }



.news-page .news-dates-toggle-btns {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 63px;
    border: 2px solid #E8EEF7;
    border-radius: 8px;
    margin-top: 25px;
    margin-bottom: 28px;
    border-radius: 8px;
    overflow: hidden;
}





    .news-page .news-dates-toggle-btns .years select {
        width: 107px;
        height: 44px;
        border: 1px solid #E6ECF5;
        padding: 8px;
        margin-left: 15px;
        direction: rtl;
        border-radius: 5px;
    }

    .news-page .news-dates-toggle-btns .months {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        width: 100%;
    }

        .news-page .news-dates-toggle-btns .months button {
            width: 100%;
            height: 63px;
            border: none;
            outline: none;
            background-color: transparent;
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: center;
            color: #000000;
        }

            .news-page .news-dates-toggle-btns .months button.active {
                background: var(--primary-color);
                color: #fff;
            }





.news-page .news-item {
    width: 364px;
    min-height: 465px;
    position: relative;
    margin-left: 40px;
    margin-right: 27px;
}


    .news-page .news-item img {
        width: 100%;
        height: 343px;
        border-radius: 10px;
        object-fit: cover;
    }


    .news-page .news-item .text {
        width: 90%;
        background-color: #fff;
        position: absolute;
        bottom: 34px;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 10px;
        padding: 26px;
        min-height: 170px;
        text-align: right;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
        opacity: 0.9;
    }

/*        .news-page .news-item .text h4 {
            font-weight: 500;
            font-size: 13px;
            color: #808080;
        }*/

        .news-page .news-item .text p {
            font-weight: 700;
            font-size: 16px;
            color: #26283b;
        }


        .news-page .news-item .text a {
            font-weight: 500;
            font-size: 13px;
            color: #063579;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
        }



/* End News Page Styles */



/* Start news-inner-page Styles */



/*.news-inner-page .main-img img {
    width: 100%;
    object-fit: cover;
    height: 590px;
    border-radius: 15px;
}*/

/*
.news-inner-page .news-text {
    margin: 30px;
    margin-top: -60px;
    background-color: #fff;
    position: relative;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #EAEAEA;
}

    .news-inner-page .news-text .header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 20px;
    }


        .news-inner-page .news-text .header .options {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 20px;
        }

            .news-inner-page .news-text .header .options a {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 12px;
                width: 130px;
                height: 50px;
                border-radius: 8px;
                padding: 20px;
                background: #F5F7FA;
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: center;
                color: #2C2C2C;
            }

                .news-inner-page .news-text .header .options a i {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    height: 32px;
                    width: 32px;
                    padding: 15px;
                    background: var(--primary-color);
                    border-radius: 8px;
                    font-size: 20px;
                    color: #fff;
                }




        .news-inner-page .news-text .header h3 {
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            text-align: right;
            color: #808080;
        }

    .news-inner-page .news-text h2 {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        color: #26283B;
        text-align: right;
        direction: rtl;
        margin-bottom: 40px;
    }

    .news-inner-page .news-text p {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        color: #26283B;
        text-align: justify;
        text-align: right;
        direction: rtl;
        margin-bottom: 43px;
    }*/


/* End news-inner-page Styles */



/* Start publications-page Styles */


.publications-page {
}



    .publications-page .header {
    }






        /*.publications-page .header .search {
            display: flex;
            flex-direction: row;
            align-items: center;*/
        /* justify-content: space-between;*/
        /*margin-bottom: 40px;
            background-color: #f5f7fa;
            border: 2px solid #E8EEF7;
            border-radius: 8px;
        }*/


        .publications-page .header .search button {
            width: 60px;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 0 8px 8px 0;
            outline: none;
            border: none;
        }

        .publications-page .header .search .custom-date-input {
            width: 15%;
            position: relative;
            direction: rtl;
        }

            .publications-page .header .search .custom-date-input i {
                position: absolute;
                left: 56px;
                top: 50%;
                transform: translateY(-50%);
            }



            .publications-page .header .search .custom-date-input input:nth-child(2) {
                width: 147px;
                height: 44px;
                border-radius: 8px;
                border: 1px solid #e8eef7;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                direction: rtl;
            }

        .publications-page .header .search > label {
            font-size: 15px;
            font-weight: 500;
            text-align: right;
            color: #26293E;
        }

    /*.publications-page .header .search > input {
                width: 100%;
                height: 65px;
                border-radius: 0 10px 10px 0;
                outline: none;
                border: none;
                padding: 15px;
                text-align: right;
                font-size: 16px;
                color: #000;
            }*/

    .publications-page .publication {
        height: 250px;
        margin-bottom: 35px;
        position: relative;
        border-radius: 14px;
    }



        .publications-page .publication a {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            height: 100%;
            justify-content: flex-end;
            padding: 7px;
        }

        .publications-page .publication img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            position: absolute;
            inset: 0;
            border-radius: 10px;
        }

        .publications-page .publication h1 {
            position: relative;
            font-family: Tajawal;
            font-size: 22px;
            font-weight: 500;
            text-align: center;
            color: #fff;
            padding-bottom: 17px;
        }







/* End publications-page Styles */



/* Start publication-sub-page Section */

.publication-sub-page {
}



    .publication-sub-page .publication-dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        height: 63px;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
    }





        .publication-sub-page .publication-dates-toggle-btns .years select {
            width: 107px;
            height: 44px;
            border: 1px solid #E6ECF5;
            padding: 8px;
            margin-left: 15px;
            direction: rtl;
            border-radius: 5px;
        }

        .publication-sub-page .publication-dates-toggle-btns .months {
            display: flex;
            flex-direction: row;
            align-items: center;
            width: 100%;
        }

            .publication-sub-page .publication-dates-toggle-btns .months button {
                width: 100%;
                height: 63px;
                border: none;
                outline: none;
                background-color: transparent;
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: center;
                color: #000000;
            }

                .publication-sub-page .publication-dates-toggle-btns .months button.active {
                    background: var(--primary-color);
                    color: #fff;
                }




    .publication-sub-page .publication-item {
        width: 364px;
        min-height: 610px;
        position: relative;
        margin-left: 40px;
        margin-right: 27px;
    }


        .publication-sub-page .publication-item img {
            width: 100%;
            height: 500px;
            border-radius: 10px;
            object-fit: cover;
        }

        .publication-sub-page .publication-item .text {
            width: 90%;
            background-color: #fff;
            position: absolute;
            bottom: 34px;
            left: 50%;
            transform: translateX(-50%);
            border-radius: 10px;
            padding: 26px;
            min-height: 170px;
            text-align: right;
            justify-content: space-between;
            display: flex;
            flex-direction: column;
        }

            .publication-sub-page .publication-item .text h4 {
                font-weight: 500;
                font-size: 13px;
                color: #808080;
                text-align: left;
            }

            .publication-sub-page .publication-item .text p {
                font-weight: 700;
                font-size: 16px;
                color: #26283b;
            }


            .publication-sub-page .publication-item .text a {
                font-weight: 500;
                font-size: 13px;
                color: #063579;
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 15px;
            }



/* End publication-sub-page Section */



/* Start Events Section */

.events-page .events-dates-toggle-btns {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 63px;
    border: 2px solid #E8EEF7;
    border-radius: 8px;
    margin-top: 25px;
    margin-bottom: 28px;
    border-radius: 8px;
    overflow: hidden;
}





    .events-page .events-dates-toggle-btns .years select {
        width: 107px;
        height: 44px;
        border: 1px solid #E6ECF5;
        padding: 8px;
        margin-left: 15px;
        direction: rtl;
        border-radius: 5px;
    }

    .events-page .events-dates-toggle-btns .months {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
    }

        .events-page .events-dates-toggle-btns .months button {
            width: 100%;
            height: 63px;
            border: none;
            outline: none;
            background-color: transparent;
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: center;
            color: #000000;
        }

            .events-page .events-dates-toggle-btns .months button.active {
                background: var(--primary-color);
                color: #fff;
            }





.events-page .event-item {
    width: 364px;
    min-height: 400px;
    position: relative;
    margin-left: 40px;
    margin-right: 27px;
}


    .events-page .event-item img {
        width: 100%;
        height: 300px;
        border-radius: 10px;
        object-fit: cover;
    }

    .events-page .event-item .text {
        width: 90%;
        background-color: #fff;
        position: absolute;
        bottom: 34px;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 10px;
        padding: 26px;
        min-height: 170px;
        text-align: right;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

        .events-page .event-item .text h4 {
            font-weight: 500;
            font-size: 13px;
            color: #fff;
            height: 40px;
            width: 130px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            border-radius: 5px;
            margin-bottom: 15px;
        }

        .events-page .event-item .text h1 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: right;
            color: #26283B;
        }

        .events-page .event-item .text h3 {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            text-align: right;
        }

            .events-page .event-item .text h3 i {
                color: var(--primary-color);
            }

        .events-page .event-item .text a {
            font-weight: 500;
            font-size: 13px;
            color: #063579;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
            width: 100%;
        }

/* End Events Section */




/* Start Events Inner Section */







.event-inner-page .main-img img {
    width: 100%;
    object-fit: cover;
    height: 590px;
    border-radius: 15px;
}


.event-inner-page .event-text {
    margin: 30px;
    margin-top: -60px;
    background-color: #fff;
    position: relative;
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #EAEAEA;
}

    .event-inner-page .event-text .header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 20px;
    }


        .event-inner-page .event-text .header .options {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 20px;
        }

            .event-inner-page .event-text .header .options a {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 12px;
                width: 130px;
                height: 50px;
                border-radius: 8px;
                padding: 20px;
                background: #F5F7FA;
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: center;
                color: #2C2C2C;
            }

                .event-inner-page .event-text .header .options a i {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    height: 32px;
                    width: 32px;
                    padding: 15px;
                    background: var(--primary-color);
                    border-radius: 8px;
                    font-size: 20px;
                    color: #fff;
                }


        .event-inner-page .event-text .header .date-loc {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 21px;
        }



            .event-inner-page .event-text .header .date-loc h3 {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 5px;
                font-family: Tajawal;
                font-size: 16px;
                font-weight: 500;
                text-align: right;
            }

                .event-inner-page .event-text .header .date-loc h3 i {
                    color: var(--primary-color);
                }

            .event-inner-page .event-text .header .date-loc h4 {
                font-weight: 500;
                font-size: 13px;
                color: #fff;
                height: 40px;
                width: 130px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                background: var(--primary-color);
                border-radius: 5px;
                margin-bottom: 15px;
            }


    .event-inner-page .event-text h2 {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        color: #26283B;
        text-align: right;
        direction: rtl;
        margin-bottom: 40px;
    }

    .event-inner-page .event-text p {
        font-family: Tajawal;
        font-size: 16px;
        font-weight: 500;
        color: #26283B;
        text-align: justify;
        text-align: right;
        direction: rtl;
        margin-bottom: 43px;
    }




/* End Events Inner Section */




/* Start Media Section */


/*.media-page .media-item {
    width: 364px;
    min-height: 400px;
    position: relative;
    margin-left: 0;
    margin-right: 0;
    width: 100%;
}


    .media-page .media-item img {
        width: 100%;
        height: 300px;
        border-radius: 10px;
        object-fit: cover;
        cursor: pointer;
    }

    .media-page .media-item .text {
        width: 90%;
        background-color: #fff;
        position: absolute;
        bottom: 34px;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 10px;
        padding: 26px;
        min-height: 170px;
        text-align: right;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }


        .media-page .media-item .text h1 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: right;
            color: #26283B;
        }


    .media-page .media-item .item-popup {
        position: fixed;
        inset: 0;
        width: 100%;
        height: 100%;
        background-color: #000000a8;
        z-index: 50;
        display: none;
        z-index: 60000;
    }

        .media-page .media-item .item-popup .close-pop-up, media-page .media-item .item-popup-media .close-pop-up {
            position: absolute;
            z-index: 2;
            right: 35px;
            top: 45px;
            background-color: transparent;
            outline: none;
            border: none;
            color: #fff;
            font-size: 36px;
        }
.item-popup .close-pop-up, .item-popup-media .close-pop-up {
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
    font-size: 36px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none;
    outline: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    transition: background-color 0.3s ease;
    margin-bottom: 12px;
}

    .item-popup .close-pop-up:hover, .item-popup-media .close-pop-up {
        background-color: rgba(0, 0, 0, 0.9);*/ /* غامق أكتر عند المرور */
    /*}
        .media-page .media-item .item-popup .item-content {
            position: absolute;
            width: 100%;
            height: 100%;
            inset: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }


            .media-page .media-item .item-popup .item-content .sound {
                width: 50%;
                height: 50%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                background-color: #fff;
                border-radius: 17px;
            }


                .media-page .media-item .item-popup .item-content .sound audio {
                    width: 80%;
                }


            .media-page .media-item .item-popup .item-content .video {
                width: 90%;
                height: 90%;
            }

                .media-page .media-item .item-popup .item-content .video video {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    border-radius: 15px;
                }

                .media-page .media-item .item-popup .item-content .video iframe {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    border-radius: 15px;
                }



            .media-page .media-item .item-popup .item-content .image {
                width: 90%;
                height: 90%;
            }

                .media-page .media-item .item-popup .item-content .image img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    border-radius: 15px;
                }*/



/* End Media Section */



/* Start Blog Page Section  */

.blog-page .blog-item {
    width: 364px;
    min-height: 465px;
    position: relative;
    margin-left: 40px;
    margin-right: 27px;
}


    .blog-page .blog-item img {
        width: 100%;
        height: 343px;
        border-radius: 10px;
    }

    .blog-page .blog-item .text {
        width: 90%;
        background-color: #fff;
        position: absolute;
        bottom: 34px;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 10px;
        padding: 26px;
        min-height: 170px;
        text-align: right;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
    }

        .blog-page .blog-item .text h4 {
            font-weight: 500;
            font-size: 13px;
            color: #808080;
        }

        .blog-page .blog-item .text h1 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: right;
            color: #26283B;
        }




        .blog-page .blog-item .text p {
            font-weight: 700;
            font-size: 16px;
            color: #26283b;
        }


        .blog-page .blog-item .text a {
            font-weight: 500;
            font-size: 13px;
            color: #063579;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 15px;
        }




/* End Blog Page Section */


/* Start advice-page Section */


.advice-page .advice-header,
.questionnaires-page .questionnaires-header {
    margin-bottom: 50px;
    margin-top: 50px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

    .advice-page .advice-header .search,
    .questionnaires-page .questionnaires-header .search {
        position: relative;
        display: flex;
        flex-direction: row;
        align-items: center;
    }

        .advice-page .advice-header .search button,
        .questionnaires-page .questionnaires-header .search button {
            width: 72px;
            height: 65px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            background: var(--primary-color);
            outline: none;
            border: none;
            border-radius: 8px 0 0 8px;
        }



        .advice-page .advice-header .search input,
        .questionnaires-page .questionnaires-header .search input {
            width: 420px;
            height: 65px;
            border-radius: 0 8px 8px 0;
            border: 1px solid #D4DDE9;
            padding-left: 20px;
            padding-right: 20px;
            direction: rtl;
        }

    .advice-page .advice-header .btns,
    .questionnaires-page .questionnaires-header .btns {
        height: 65px;
        border: 1px solid #D4DDE9;
        border-radius: 8px;
        overflow: hidden;
        display: flex;
        flex-direction: row;
    }

        .advice-page .advice-header .btns button,
        .questionnaires-page .questionnaires-header .btns button {
            width: 200px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            color: #000;
            font-family: Tajawal;
            font-size: 15px;
            font-weight: 700;
            text-align: center;
            background-color: transparent;
            outline: none;
            border: none;
        }


            .advice-page .advice-header .btns button.active,
            .questionnaires-page .questionnaires-header .btns button.activ {
                color: #fff;
                background: var(--primary-color);
            }



.advice-page .advice,
.questionnaires-page .questionnair {
    background: #FAF9F8;
    border-radius: 10px;
    padding: 35px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 32px;
    margin-bottom: 30px;
    min-height: 320px;
    justify-content: space-between;
}


    .advice-page .advice h1,
    .questionnaires-page .questionnair h1 {
        font-family: Tajawal;
        font-size: 20px;
        font-weight: 700;
        text-align: right;
        color: #141414;
    }

    .advice-page .advice h3,
    .questionnaires-page .questionnair h3 {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 5px;
    }

        .advice-page .advice h3 span,
        .questionnaires-page .questionnair h3 span {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: right;
            color: var(--primary-color);
        }


        .advice-page .advice h3 i,
        .questionnaires-page .questionnair h3 i {
            color: var(--primary-color);
        }


    .advice-page .advice .options,
    .questionnaires-page .questionnair .options {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

        .advice-page .advice .options button,
        .questionnaires-page .questionnair .options button {
            height: 40px;
            width: 135px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            color: #fff;
            gap: 10px;
            border-radius: 8px;
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            outline: none;
            border: none;
            background-color: var(--primary-color);
        }


        .advice-page .advice .options a,
        .questionnaires-page .questionnair .options a {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 10px;
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            color: var(--primary-color);
        }


/* End advice-page Section */



/* Start advice-inner-page Section */

.advice-inner-page {
}

    .advice-inner-page .header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 32px;
    }

        .advice-inner-page .header button {
            height: 40px;
            width: 135px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            color: #fff;
            gap: 10px;
            border-radius: 8px;
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            outline: none;
            border: none;
            background-color: var(--primary-color);
        }

        .advice-inner-page .header h3 {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            font-size: 18px;
        }

            .advice-inner-page .header h3 span {
                font-family: Tajawal;
                font-size: 16px;
                font-weight: 500;
                text-align: right;
                color: var(--primary-color);
                direction: rtl;
                display: flex;
                flex-direction: row-reverse;
                gap: 5px;
            }


            .advice-inner-page .header h3 i {
                color: var(--primary-color);
            }


    .advice-inner-page .advice-text {
        direction: rtl;
    }


        .advice-inner-page .advice-text h1 {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 700;
            color: #191919;
        }

        .advice-inner-page .advice-text p {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: justify;
            color: #191919;
            margin-bottom: 45px;
        }


        .advice-inner-page .advice-text ul {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            color: #191919;
            margin-bottom: 45px;
            padding: 17px !important;
        }

            .advice-inner-page .advice-text ul li {
                display: list-item;
                list-style: decimal;
            }


/* End advice-inner-page Section */



/* Start Open-data-form Section */










/* End Open-data-form Section */



/* Start polls-page Section */
.polls-page {
}



    .polls-page .polls-header {
        margin-bottom: 50px;
        margin-top: 50px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

        .polls-page .polls-header .search {
            position: relative;
            display: flex;
            flex-direction: row;
            align-items: center;
        }

            .polls-page .polls-header .search button {
                width: 72px;
                height: 65px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                background: var(--primary-color);
                outline: none;
                border: none;
                border-radius: 8px 0 0 8px;
            }



            .polls-page .polls-header .search input {
                width: 420px;
                height: 65px;
                border-radius: 0 8px 8px 0;
                border: 1px solid #D4DDE9;
                padding-left: 20px;
                padding-right: 20px;
                direction: rtl;
            }

        .polls-page .polls-header .btns {
            height: 65px;
            border: 1px solid #D4DDE9;
            border-radius: 8px;
            overflow: hidden;
            display: flex;
            flex-direction: row;
        }

            .polls-page .polls-header .btns button {
                width: 200px;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                color: #000;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 700;
                text-align: center;
                background-color: transparent;
                outline: none;
                border: none;
            }


                .polls-page .polls-header .btns button.active {
                    color: #fff;
                    background: var(--primary-color);
                }


    .polls-page .polls-content {
        direction: rtl;
    }


        .polls-page .polls-content .info {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            justify-content: space-between;
            margin-top: 50px;
            margin-bottom: 50px;
        }


            .polls-page .polls-content .info button {
                width: 130px;
                height: 47px;
                background: #FAF9F8;
                padding: 20px;
                border-radius: 8px;
                border: none;
                outline: none;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                gap: 10px;
            }

                .polls-page .polls-content .info button i {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    justify-content: center;
                    width: 32px;
                    height: 32px;
                    border-radius: 7px;
                    background: var(--primary-color);
                    color: #fff;
                }

                .polls-page .polls-content .info button span {
                    font-family: Tajawal;
                    font-size: 14px;
                    font-weight: 500;
                    text-align: center;
                    color: var(--primary-color);
                }


            .polls-page .polls-content .info h3 {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 5px;
                font-size: 18px;
            }

                .polls-page .polls-content .info h3 span {
                    font-family: Tajawal;
                    font-size: 17px;
                    font-weight: 500;
                    text-align: right;
                    color: var(--primary-color);
                }


                .polls-page .polls-content .info h3 i {
                    color: var(--primary-color);
                }

    .polls-page .form-element {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        margin-bottom: 31px;
        width: fit-content;
    }


    .polls-page h1 {
        font-family: Tajawal;
        font-size: 20px;
        font-weight: 700;
        text-align: right;
        color: #383838;
        margin-bottom: 30px;
    }


    .polls-page .form-element .input {
        direction: ltr;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 10px;
        margin-bottom: 19px;
    }

        .polls-page .form-element .input label {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: right;
            color: #383838;
        }

        .polls-page .form-element .input input {
            cursor: pointer;
        }


    .polls-page .form-element .options {
        margin-top: 30px;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-around;
        width: 100%;
    }

        .polls-page .form-element .options button:nth-child(1) {
            width: 290px;
            height: 45px;
            border-radius: 8px;
            background-color: var(--primary-color);
            color: #fff;
            outline: none;
            border: none;
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            justify-content: center;
            gap: 15px;
        }

        .polls-page .form-element .options button:nth-child(2) {
            width: 210px;
            height: 47px;
            border-radius: 8px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            gap: 5px;
            background-color: transparent;
            outline: none;
            border: none;
        }


    .polls-page .poll-results {
        height: 260px;
        border-radius: 10px;
        padding: 30px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 26px;
        border: 1px solid #D4DDE9;
    }

        .polls-page .poll-results .result {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            justify-content: space-between;
            gap: 5px;
            width: 100%;
        }

            .polls-page .poll-results .result span {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                width: 10%;
            }

            .polls-page .poll-results .result .result-bar {
                width: 100%;
            }

                .polls-page .poll-results .result .result-bar .bar {
                    height: 22px;
                    background: #C3B79A;
                }


            .polls-page .poll-results .result h2 {
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: right;
                width: 20%;
            }


/* End polls-page Section */



/* Start Policypage Section */





.policy-page .policy-page-text {
    direction: rtl;
}


    .policy-page .policy-page-text h1 {
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 700;
        color: #191919;
    }

    .policy-page .policy-page-text p {
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        text-align: justify;
        color: #191919;
        margin-bottom: 45px;
    }


    .policy-page .policy-page-text ul {
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        color: #191919;
        margin-bottom: 45px;
        padding: 17px !important;
    }




/* End Policypage Section */




/* Start open-data-main Section */


.open-data-main .data-main {
    width: 100%;
    height: 250px;
    border: 2px solid #E8EEF7;
    border-radius: 8px;
    margin-bottom: 30px;
}


    .open-data-main .data-main a {
        width: 100%;
        height: 250px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 30px;
    }



        .open-data-main .data-main a h2 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: center;
            color: #26283B;
        }


/* End open-data-main Section */




/* Start usage-analytics-page Section */

.usage-analytics-page {
}

    .usage-analytics-page .analytic {
        width: 100%;
        height: 250px;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        margin-bottom: 30px;
    }

        .usage-analytics-page .analytic a {
            width: 100%;
            height: 250px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 30px;
        }



        .usage-analytics-page .analytic h3 {
            font-family: Tajawal;
            font-size: 15px;
            font-weight: 700;
            text-align: center;
            color: #26283B;
        }

        .usage-analytics-page .analytic h2 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: center;
            color: #26283B;
        }



    .usage-analytics-page h1 {
        font-family: Tajawal;
        font-size: 22px;
        font-weight: 700;
        color: #26283B;
        text-align: right;
        width: 100%;
    }

/* End usage-analytics-page Section */


/* Start speeds-table content-table Section */
/*@media (max-width: 950px) {
    .publications-page .header .search {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        padding-top: 27px;
        padding-bottom: 27px;
    }
}*/




.speeds-page .header .search {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 40px;
    background-color: #f5f7fa;
    border: 2px solid #E8EEF7;
    border-radius: 8px;
    /*padding: 5px !important;*/
}


    .speeds-page .header .search button {
        width: 60px;
        height: 65px;
        background: var(--primary-color);
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        border-radius: 0 8px 8px 0;
        outline: none;
        border: none;
        /*        margin-right: 10px;
*/
    }

    .speeds-page .header .search .custom-date-input {
        width: 15%;
        position: relative;
        direction: rtl;
    }

        .speeds-page .header .search .custom-date-input i {
            position: absolute;
            left: 56px;
            top: 50%;
            transform: translateY(-50%);
        }



        .speeds-page .header .search .custom-date-input input:nth-child(2) {
            width: 147px;
            height: 44px;
            border-radius: 8px;
            border: 1px solid #e8eef7;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            direction: rtl;
        }

    .speeds-page .header .search > label {
        font-size: 15px;
        font-weight: 500;
        text-align: right;
        color: #26293E;
    }

    /*.speeds-page .header .search > input {*/
    /*width: 23%;*/
    /*height: 40px;
        border-radius: 0 10px 10px 0;
        outline: none;
        border: none;
        padding: 15px;
        text-align: right;
        font-size: 16px;
        color: #000;
    }*/


    .speeds-page .header .search > select {
        width: 15%;
        height: 40px;
        border-radius: 0 10px 10px 0;
        outline: none;
        border: none;
        padding: 15px;
        text-align: right;
        font-size: 16px;
        color: #000;
        direction: rtl;
    }




.content-table {
    width: 100%;
    overflow-x: scroll;
}

    .content-table table {
        width: 1298px;
    }

        .content-table table tr {
            border: 1px solid #000;
            border-radius: 29px;
            margin: 15px;
            padding: 10px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            border: 2px solid #E8EEF7;
            border-radius: 8px;
            gap: 22px;
            transition: 0.5s;
        }

            .content-table table tr:hover {
                background-color: #eee;
            }

            .content-table table tr:nth-child(1) {
                border: none;
            }

            .content-table table tr th {
                font-family: Tajawal;
                font-size: 16px;
                font-weight: 700;
                text-align: right;
                color: #161616;
                width: 20%;
            }

                .content-table table tr th:nth-last-child(2) {
                    width: 40%;
                }


            .content-table table tr td {
                width: 20%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: flex-end;
            }

                .content-table table tr td h4 {
                    font-family: Tajawal;
                    font-size: 17px;
                    font-weight: 500;
                    text-align: right;
                    color: #26283B;
                    text-align: right;
                    direction: rtl;
                    line-height: 27px;
                }

                .content-table table tr td:nth-last-child(2) {
                    width: 40%;
                }



                .content-table table tr td h2 {
                    font-family: Tajawal;
                    font-size: 17px;
                    font-weight: 500;
                    text-align: right;
                    color: #26283B;
                    width: 100%;
                }


    .content-table button {
        background-color: transparent;
        outline: none;
        border: none;
        margin-left: 17px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        width: 25px;
        height: 25px;
        border-radius: 8px;
        background: #F5F7FA;
    }

    .content-table a {
        background-color: transparent;
        outline: none;
        border: none;
        margin-left: 17px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        width: 25px;
        height: 25px;
        border-radius: 8px;
        background: #F5F7FA;
        outline: none;
    }



/* End speeds-table content-table Section */



/* Start  open-data-form-2 Section */
.open-data-form-2 {
    margin-bottom: 100px;
}

    .open-data-form-2 .inputs .special-input {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
    }



    .open-data-form-2 .date-input {
        font-size: 20px;
        position: absolute;
        left: 20px;
        z-index: 3;
        color: #999292;
        top: 15px;
    }


/* End  open-data-form-2 Section */



/* Start three-d-open-data Section */

.three-d-open-data {
}




    .three-d-open-data .header .search {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
    }


        .three-d-open-data .header .search button {
            width: 60px;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 8px 0 0 8px;
            outline: none;
            border: none;
        }

        .three-d-open-data .header .search .custom-date-input {
            width: 15%;
            position: relative;
            direction: rtl;
        }

            .three-d-open-data .header .search .custom-date-input i {
                position: absolute;
                left: 56px;
                top: 50%;
                transform: translateY(-50%);
            }



            .three-d-open-data .header .search .custom-date-input input:nth-child(2) {
                width: 147px;
                height: 44px;
                border-radius: 8px;
                border: 1px solid #e8eef7;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                direction: rtl;
            }

        .three-d-open-data .header .search > label {
            font-size: 15px;
            font-weight: 500;
            text-align: right;
            color: #26293E;
        }

        .three-d-open-data .header .search > input {
            width: 23%;
            height: 40px;
            border-radius: 0 10px 10px 0;
            outline: none;
            border: none;
            padding: 15px;
            text-align: right;
            font-size: 16px;
            color: #000;
        }


        .three-d-open-data .header .search > select {
            width: 15%;
            height: 40px;
            border-radius: 0 10px 10px 0;
            outline: none;
            border: none;
            padding: 15px;
            text-align: right;
            font-size: 16px;
            color: #000;
            direction: rtl;
        }



    .three-d-open-data .open-data-stats .stats-header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 34px;
    }


        .three-d-open-data .open-data-stats .stats-header .btns {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            gap: 25px;
        }

            .three-d-open-data .open-data-stats .stats-header .btns button {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                gap: 5px;
                background-color: transparent;
                outline: none;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 500;
                text-align: right;
                color: #26293E;
                border: none;
                outline: none;
            }

        .three-d-open-data .open-data-stats .stats-header h1 {
            font-family: Tajawal;
            font-size: 24px;
            font-weight: 700;
            text-align: right;
            color: #26283B;
        }



    .three-d-open-data .open-data-stats .slider .slide .state {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

        .three-d-open-data .open-data-stats .slider .slide .state img:nth-child(1) {
            width: 70%;
            height: 400px;
            object-fit: contain;
        }

        .three-d-open-data .open-data-stats .slider .slide .state img:nth-child(2) {
            width: 30%;
            height: 400px;
            object-fit: contain;
        }






/* End three-d-open-data Section */





/* Start commander-talk Section */
.commander-talk {
}

    .commander-talk .commander-image {
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }


        .commander-talk .commander-image img {
            height: 450px;
            width: 100%;
            object-fit: contain;
        }


    .commander-talk .text {
        color: #26283B;
        direction: rtl;
    }


        .commander-talk .text h1 {
            font-family: Tajawal;
            font-size: 32px;
            font-weight: 700;
            text-align: right;
            margin-bottom: 30px;
        }

        .commander-talk .text h2 {
            font-family: Tajawal;
            font-size: 25px;
            font-weight: 500;
            text-align: right;
        }

        .commander-talk .text h3 {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            margin-bottom: 25px;
        }

        .commander-talk .text h4 {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 700;
        }

        .commander-talk .text p {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            text-align: justify;
            margin-bottom: 60px;
        }



/* End commander-talk Section */



/* Start organization-page Section */



.organization-page .organization {
    padding-bottom: 80px;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

    .organization-page .organization h1 {
        height: 71px;
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        font-family: Tajawal;
        font-size: 20px;
        font-weight: 500;
        text-align: center;
        color: #fff;
        background: var(--primary-color);
        padding: 18px;
        border-radius: 8px;
    }


    .organization-page .organization h2 {
        border: 2px solid #E8EEF7;
        width: 100%;
        height: 56px;
        border-radius: 8px;
        text-align: right;
        padding: 15px;
        font-family: Tajawal;
        font-size: 15px;
        font-weight: 500;
        text-align: right;
        color: #26283B;
        background-color: #fff;
    }


    .organization-page .organization .line-ver {
        height: 100%;
        position: absolute;
        background-color: #E8EEF7;
        width: 1px;
        left: 50%;
        transform: translateX(-50%);
        z-index: -1;
        top: -21px;
    }


    .organization-page .organization .line-hor {
        width: 211%;
        height: 1px;
        background-color: #E8EEF7;
        top: -21px;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }




/* End organization-page Section */



/* Start history-page Section */


.history-page .history-main-img {
    margin-bottom: 60px;
}

    .history-page .history-main-img img {
        width: 100%;
        object-fit: cover;
        height: 500px;
        border-radius: 10px;
    }



.history-page .history {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 60px;
}


    .history-page .history .text {
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        line-height: 26px;
        color: #000000;
        direction: rtl;
    }



    .history-page .history .image {
        position: relative;
    }

        .history-page .history .image h1 {
            position: absolute;
            top: 50%;
            left: 35%;
            transform: translate(-50%, -50%);
            color: #fff;
            font-family: Tajawal;
            font-size: 51px;
            font-weight: 500;
            letter-spacing: 0.03em;
            text-align: center;
        }

        .history-page .history .image img {
            width: 300px;
            height: 200px;
            object-fit: cover;
            border-radius: 10px;
        }


/* End history-page Section */




/* Start overview-page Section */


.overview-page .image {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    margin-top: 80px;
}

    .overview-page .image img {
        width: 100%;
        height: 350px;
        object-fit: contain;
    }

.overview-page .text {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    direction: rtl;
    color: #2A2A2A;
    margin-top: 80px;
}


    .overview-page .text h1 {
        font-family: Tajawal;
        font-size: 34px;
        font-weight: 700;
        text-align: right;
    }


    .overview-page .text p {
        font-family: Tajawal;
        font-size: 18px;
        font-weight: 500;
        text-align: right;
        margin-top: 20px;
    }

    .overview-page .text ul {
        font-family: Tajawal;
        font-size: 18px;
        font-weight: 500;
        line-height: 26px;
        text-align: right;
        display: flex;
        flex-wrap: wrap;
        margin-top: 26px;
    }

    /*        .overview-page .text ul li {
            width: 50%;
            margin-bottom: 15px;
        }
*/

    .overview-page .text .one-to-one {
        flex-direction: row;
    }

    .overview-page .text .one-col {
        flex-direction: column;
    }

    .overview-page .text ul.one-col li {
        width: 100%;
        margin-bottom: 15px;
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 15px;
    }



/* End overview-page Section */




/* Start questionnaires-inner Section */



.questionnaires-inner .questionnaires-inner-content {
    direction: rtl;
}

    .questionnaires-inner .questionnaires-inner-content h1 {
        font-family: Tajawal;
        font-size: 31px;
        font-weight: 700;
        text-align: right;
        color: #000000;
        margin-bottom: 60px;
    }



    .questionnaires-inner .questionnaires-inner-content .inputs {
        margin-bottom: 41px;
    }

        .questionnaires-inner .questionnaires-inner-content .inputs h2 {
            font-family: Tajawal;
            font-size: 16px;
            font-weight: 500;
            text-align: right;
            color: #000000;
            margin-bottom: 20px;
        }

        .questionnaires-inner .questionnaires-inner-content .inputs .input-radio {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            gap: 10px;
            justify-content: flex-end;
            margin-top: 10px;
        }


            .questionnaires-inner .questionnaires-inner-content .inputs .input-radio label {
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: right;
                color: var(--primary-color);
            }



.questionnaires-inner .star-rating {
    direction: ltr; /* Right to left to simplify hover effect */
    width: fit-content;
}


    .questionnaires-inner .star-rating .star {
        font-size: 30px;
        color: gray;
        cursor: pointer;
    }

    /* Hide the radio buttons */

    .questionnaires-inner .star-rating input[type="radio"] {
        display: none;
    }

        /* Gold star styles for hover and checked states */

        .questionnaires-inner .star-rating input[type="radio"]:checked ~ label,
        .questionnaires-inner .star-rating label:hover,
        .questionnaires-inner .star-rating label:hover ~ label {
            color: gold;
        }

.star-rating .active {
    color: gold;
}



.questionnaires-inner .questionnaires-inner-content .inputs .input input {
    width: 50%;
    height: 55px;
    border: 1px solid #DAE2EE;
    padding-left: 25px;
    padding-right: 20px;
    color: #000;
    font-size: 16px;
    border-radius: 10px;
}


.questionnaires-inner .questionnaires-inner-content .inputs .input textarea {
    width: 100%;
    height: 170px;
    border: 1px solid #DAE2EE;
    padding-left: 25px;
    padding-right: 20px;
    color: #000;
    font-size: 16px;
    border-radius: 10px;
}

.questionnaires-inner .questionnaires-inner-content .inputs .input .btns {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
}


    .questionnaires-inner .questionnaires-inner-content .inputs .input .btns button {
        width: 144px;
        height: 50px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        gap: 10px;
        color: #000;
        font-family: Tajawal;
        font-size: 14px;
        font-weight: 500;
        text-align: center;
        background: #FAF9F8;
    }


.questionnaires-inner .questionnaires-inner-content .inputs .input .natio-btns {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
}


    .questionnaires-inner .questionnaires-inner-content .inputs .input .natio-btns button {
        width: 270px;
        height: 55px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        background-color: transparent;
        border: 1px solid #DAE2EE;
        outline: none;
        border-radius: 10px;
    }

    .questionnaires-inner .questionnaires-inner-content .inputs .input .natio-btns select {
        width: 236px;
        height: 55px;
        border: 1px solid #DAE2EE;
        padding-left: 25px;
        padding-right: 20px;
        color: #000;
        font-size: 16px;
        border-radius: 10px;
    }

.questionnaires-inner .questionnaires-inner-content .form-element > button {
    width: 220px;
    height: 45px;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 15px;
    color: #fff;
    background: var(--primary-color);
    justify-content: center;
    border: none;
    outline: none;
    border-radius: 10px;
}


/* End questionnaires-inner Section */




/* Start ShortCuts Section */

/*body .short-cuts {
    position: fixed;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) !important;
    z-index: 10;
}*/


.short-cuts .content {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

    .short-cuts .content .short-cut {
        position: relative;
    }


        .short-cuts .content .short-cut button {
            background-color: transparent;
            outline: none;
            border: none;
        }



.inner-short-cut {
    display: none;
}


    .inner-short-cut.active {
        display: block;
    }

    /*    .inner-short-cut .happines-element {
        width: 400px;
        height: fit-content;
        background: #FAF9F8;
        border-radius: 8px;
        padding: 20px;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-38%);
        z-index: 15;
    }*/


    .inner-short-cut .happines-element .content h1 {
        font-family: Tajawal;
        font-size: 18px;
        font-weight: 500;
        text-align: center;
        color: #000000;
        margin-bottom: 23px;
    }


    .inner-short-cut .happines-element .content .element .form-element {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .inner-short-cut .happines-element .content .element .input {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

        .inner-short-cut .happines-element .content .element .input .faces {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            width: 40%;
        }

    .inner-short-cut .happines-element .content .element .form-element .input .faces .face {
        width: fit-content;
        position: relative;
        cursor: pointer;
        height: fit-content;
        display: flex;
        z-index: 5;
    }



        .inner-short-cut .happines-element .content .element .form-element .input .faces .face img {
            display: block;
        }

            .inner-short-cut .happines-element .content .element .form-element .input .faces .face img:nth-child(2) {
                display: none;
            }

        .inner-short-cut .happines-element .content .element .form-element .input .faces .face:hover img:nth-child(1) {
            display: none;
        }

        .inner-short-cut .happines-element .content .element .form-element .input .faces .face:hover img:nth-child(2) {
            display: block;
        }

      /*  .inner-short-cut .happines-element .content .element .form-element .input .faces .face input {
            position: absolute;
            z-index: 1;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            padding: 54px;
            width: 50px;
            height: 29px;
            opacity: 0;
            cursor: pointer;
        }*/

            .inner-short-cut .happines-element .content .element .form-element .input .faces .face input:checked + img:nth-child(1) {
                display: none;
            }

            .inner-short-cut .happines-element .content .element .form-element .input .faces .face input:checked + img:nth-child(2) {
                display: block;
            }


    .inner-short-cut .happines-element .content .element .form-element .input label {
        font-family: Tajawal;
        font-size: 14px;
        font-weight: 500;
        text-align: right;
        color: #000000;
    }



    .inner-short-cut .happines-element .content .element .form-element textarea {
        height: 190px;
        width: 100%;
        padding: 15px;
        border-radius: 10px;
        border: 1px solid #00000026;
        font-size: 16px;
        direction: rtl;
        outline: none;
    }

    .inner-short-cut .happines-element .content .element .form-element .submit-btns {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }



        .inner-short-cut .happines-element .content .element .form-element .submit-btns .submitFeedback {
            width: 190px !important;
            height: 45px !important;
            background: var(--primary-color) !important;
            display: flex !important;
            flex-direction: row !important;
            align-items: center !important;
            justify-content: center !important;
            color: #fff !important;
            border: none !important;
            outline: none !important;
            border-radius: 7px !important;
            margin-top : auto !important;
        }

        .inner-short-cut .happines-element .content .element .form-element .submit-btns button:nth-child(2) {
            width: 147px;
            height: 45px;
            background: #3a3a3a;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            color: #fff;
            border: none;
            outline: none;
            border-radius: 7px;
        }

    /*    .inner-short-cut .status-element {
        width: 400px;
        height: fit-content;
        background: #FAF9F8;
        border-radius: 8px;
        padding: 20px;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-38%);
        z-index: 15;
        margin-right: 15px;
    }*/


    .inner-short-cut .status-element button {
        background-color: transparent;
        outline: none;
        border: none;
    }

    .inner-short-cut .status-element .form-element {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }



        .inner-short-cut .status-element .form-element input {
            border: 1px solid #E8EEF7;
            width: 100%;
            height: 45px;
            border-radius: 8px;
            direction: ltr;
            padding-right: 10px;
            font-size: 15px;
            color: #000;
            outline: none;
        }

        .inner-short-cut .status-element .form-element button {
            width: 155px;
            height: 40px;
            background-color: var(--primary-color) !important;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            gap: 10px;
            color: #fff;
            border-radius: 8px;
        }

/*.short-cuts {
    width: 3%;
}
*/
.voice-search {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    z-index: 30;
    width: 100%;
    height: 100%;
    background-color: #0000008c;
    display: none;
}

    .voice-search.active {
        display: block;
    }


    .voice-search .voice-search-content {
        z-index: 1;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 50%;
        height: 78%;
        background-color: #000;
        border-radius: 11px;
        padding: 30px;
    }

        .voice-search .voice-search-content .content {
            display: flex;
            flex-direction: column;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            height: 100%;
        }

            .voice-search .voice-search-content .content p {
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                line-height: 25.98px;
                text-align: center;
                color: #fff;
                width: 79%;
                z-index: 1;
            }

            .voice-search .voice-search-content .content > img {
                position: absolute;
                inset: 0;
                width: 100%;
                height: 100%;
                object-fit: contain;
                display: none;
            }

                .voice-search .voice-search-content .content > img:nth-child(3) {
                    position: absolute;
                    inset: 0;
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                    display: block
                }

            .voice-search .voice-search-content .content button {
                width: 100px;
                height: 100px;
                border-radius: 50%;
                z-index: 2;
                background-color: transparent;
                outline: none;
                border: none;
                overflow: hidden;
                position: relative;
                outline: 7px solid #37322785;
                border: 3px solid #ffffff70;
            }

                .voice-search .voice-search-content .content button img:nth-child(1) {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    scale: 1.9;
                    left: -2px;
                    position: relative;
                    display: none;
                }

                .voice-search .voice-search-content .content button img:nth-child(2) {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%);
                }

            .voice-search .voice-search-content .content > div {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                z-index: 5;
                width: 100%;
            }


            .voice-search .voice-search-content .content h2 {
                font-family: Tajawal;
                font-size: 16px;
                font-weight: 500;
                text-align: center;
                color: #fff;
                margin-top: 15px;
            }

            .voice-search .voice-search-content .content h3 {
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: center;
                color: #fff;
                width: 100%;
                text-align: right;
                margin-top: 16px;
            }



.inner-short-cut .accessibility {
    width: 400px;
    height: fit-content;
    background: #FAF9F8;
    border-radius: 8px;
    padding: 20px;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 15;
}



    .inner-short-cut .accessibility .accessibility-content .options {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
    }

        .inner-short-cut .accessibility .accessibility-content .options .option {
            width: 33%;
            padding: 10px;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            height: 104px;
            margin-bottom: 7px;
        }

            .inner-short-cut .accessibility .accessibility-content .options .option.active {
                background-color: #eeeeee8a;
                border-radius: 5px;
            }



            .inner-short-cut .accessibility .accessibility-content .options .option button {
                display: flex;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                gap: 10px;
                font-family: Tajawal;
                font-size: 10.85px;
                font-weight: 500;
                text-align: center;
                color: #363636;
            }



                .inner-short-cut .accessibility .accessibility-content .options .option button h2 {
                    font-family: Tajawal;
                    font-size: 10.85px;
                    font-weight: 500;
                    text-align: center;
                    color: #363636;
                }


    .inner-short-cut .accessibility .accessibility-content .text-options-btns {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
        margin-bottom: 20px;
        margin-top: 20px;
    }

        .inner-short-cut .accessibility .accessibility-content .text-options-btns button {
            width: fit-content;
            padding-left: 20px;
            padding-right: 20px;
            height: 32px;
            font-family: Tajawal;
            font-size: 10.54px;
            font-weight: 500;
            text-align: right;
            color: #000;
            border-radius: 5px;
        }

            .inner-short-cut .accessibility .accessibility-content .text-options-btns button.active {
                background-color: var(--primary-color);
                color: #fff;
            }

    .inner-short-cut .accessibility .accessibility-content .text-options-screens {
    }

        .inner-short-cut .accessibility .accessibility-content .text-options-screens .screen {
            display: none;
            flex-direction: row;
            align-items: center;
            gap: 15px;
        }


            .inner-short-cut .accessibility .accessibility-content .text-options-screens .screen.active {
                display: flex;
            }

            .inner-short-cut .accessibility .accessibility-content .text-options-screens .screen img {
            }

            .inner-short-cut .accessibility .accessibility-content .text-options-screens .screen input {
            }


    .inner-short-cut .accessibility .accessibility-content .slider {
        -webkit-appearance: none;
        width: 100%;
        height: 5px;
        border-radius: 5px;
        background: var(--primary-color);
        outline: none;
        opacity: 0.7;
        -webkit-transition: .2s;
        transition: opacity .2s;
    }

        .inner-short-cut .accessibility .accessibility-content .slider::-webkit-slider-thumb {
            -webkit-appearance: none;
            appearance: none;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            background: var(--primary-color);
            cursor: pointer;
        }

        .inner-short-cut .accessibility .accessibility-content .slider::-moz-range-thumb {
            width: 18px;
            height: 18px;
            border-radius: 50%;
            background: var(--primary-color);
            cursor: pointer;
        }




    .inner-short-cut .accessibility .accessibility-content .sign-lang-container {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-top: 15px;
        margin-bottom: 17px;
    }

        .inner-short-cut .accessibility .accessibility-content .sign-lang-container button {
            width: 40px;
            height: 20px;
            border-radius: 50px;
            background-color: var(--primary-color);
            position: relative;
        }

            .inner-short-cut .accessibility .accessibility-content .sign-lang-container button.active {
                background-color: #eee;
            }

            .inner-short-cut .accessibility .accessibility-content .sign-lang-container button span {
                position: absolute;
                height: 18px;
                width: 19px;
                border-radius: 50%;
                background-color: #fff;
                right: 1px;
                top: 1px;
                transition: 0.5s;
            }


            .inner-short-cut .accessibility .accessibility-content .sign-lang-container button.active span {
                right: 19px;
            }


        .inner-short-cut .accessibility .accessibility-content .sign-lang-container h1 {
            font-family: Tajawal;
            font-size: 10.85px;
            font-weight: 500;
            text-align: right;
            color: #26283B;
        }




    .inner-short-cut .accessibility .accessibility-content > button {
        height: 37px;
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 15px;
        background-color: var(--primary-color);
        font-family: Tajawal;
        font-size: 10.85px;
        font-weight: 500;
        text-align: center;
        color: #fff;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
        outline: none;
        border: none;
    }

/* End ShortCuts Section */



/* Start Police Auto talker */

.police-auto-talker {
    position: fixed;
    bottom: 0;
    right: 6%;
    z-index: 15;
    width: 370px;
    min-height: 641px;
    border-radius: 8px 8px 0 0;
    background: #FAF9F8;
    transition: 0.5s;
    display: none;
}

    .police-auto-talker img {
        width: 50px;
        object-fit: contain;
    }



    .police-auto-talker.active {
        display: block;
    }

    .police-auto-talker.down {
        bottom: -615px;
    }


    .police-auto-talker .content {
        padding: 22px;
        height: 677px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

        .police-auto-talker .content .header {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 0;
        }


            .police-auto-talker .content .header .left {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 16px;
            }


                .police-auto-talker .content .header .left button {
                    background-color: transparent;
                    outline: none;
                    border: none;
                    font-size: 18px;
                }


            .police-auto-talker .content .header .right {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 10px;
            }


                .police-auto-talker .content .header .right h1 {
                    font-family: Tajawal;
                    font-size: 14px;
                    font-weight: 500;
                    text-align: right;
                    color: #26283B;
                }


        .police-auto-talker .content .body .date-time {
            font-family: Tajawal;
            font-size: 12px;
            font-weight: 500;
            text-align: left;
            color: #A3A3A3;
            text-align: center;
        }

        .police-auto-talker .content .body .messages {
            height: 480px;
            overflow-y: scroll;
            overflow-x: clip;
            padding: 20px;
        }

            .police-auto-talker .content .body .messages .receiver {
                display: flex;
                flex-direction: row;
                align-items: flex-start;
                gap: 15px;
                margin-top: 20px;
                margin-bottom: 20px;
            }

                .police-auto-talker .content .body .messages .receiver .message p {
                    font-family: Tajawal;
                    font-size: 13px;
                    font-weight: 500;
                    text-align: left;
                    color: #303437;
                }

                .police-auto-talker .content .body .messages .receiver .message ul {
                    font-family: Tajawal;
                    font-size: 13px;
                    font-weight: 500;
                    text-align: left;
                    color: #303437;
                    margin-top: 20px;
                    margin-bottom: 20px;
                    display: flex;
                    flex-direction: column;
                    gap: 5px;
                    direction: ltr;
                }

                    .police-auto-talker .content .body .messages .receiver .message ul li {
                        display: list-item;
                        list-style: auto;
                    }

                .police-auto-talker .content .body .messages .receiver .message h1 {
                    font-family: Tajawal;
                    font-size: 14px;
                    font-weight: 700;
                    text-align: left;
                    color: #303437;
                }

        .police-auto-talker .content .body .sender {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            justify-content: flex-end;
            margin-bottom: 25px;
            margin-top: 25px;
        }

            .police-auto-talker .content .body .sender .message {
                width: fit-content;
                padding: 10px;
                border-radius: 10px 10px 0 10px;
                background-color: var(--primary-color);
                color: #fff;
            }

            .police-auto-talker .content .body .sender p {
                font-family: Tajawal;
                font-size: 14px;
                font-weight: 500;
                text-align: center;
                color: #fff;
                margin: 0;
            }

        .police-auto-talker .content .footer {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            justify-content: space-between;
            width: 100%;
        }


            .police-auto-talker .content .footer button {
                width: 44px;
                height: 44px;
                color: #fff;
                background-color: var(--primary-color);
                border: none;
                outline: none;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                border-radius: 9px;
            }


            .police-auto-talker .content .footer input {
                width: 271px;
                height: 44px;
                border: 1px solid #E3E3E3;
                border-radius: 10px;
                direction: ltr;
                padding-left: 10px;
                padding-right: 10px;
                font-size: 16px;
                color: #000;
                outline: none;
            }


        .police-auto-talker .content .body .messages::-webkit-scrollbar {
            width: 0;
            border-radius: 50px;
            height: 0;
        }

        /* Track */
        .police-auto-talker .content .body .messages::-webkit-scrollbar-track {
            background: var(--primary-color);
            opacity: 0.5;
            border-radius: 50px;
            width: 0;
            border-radius: 50px;
            height: 0;
        }

        /* Handle */
        .police-auto-talker .content .body .messages::-webkit-scrollbar-thumb {
            background: var(--primary-color);
            border-radius: 50px;
            width: 0;
            border-radius: 50px;
            height: 0;
        }

            /* Handle on hover */
            .police-auto-talker .content .body .messages::-webkit-scrollbar-thumb:hover {
                background: var(--primary-color);
                border-radius: 50px;
                width: 0;
                border-radius: 50px;
                height: 0;
            }
/* End Police Auto talker */




/* Tour Styles */

.introjs-tooltiptext {
    text-align: right;
}


a.introjs-button.introjs-skipbutton.introjs-donebutton {
    background-color: #fff;
    outline: none;
    border: none;
    text-shadow: none;
    background-image: none;
    color: #fff;
    background-color: var(--secondary-color);
}

a.introjs-button.introjs-nextbutton {
    background-color: #fff;
    outline: none;
    border: none;
    text-shadow: none;
    background-image: none;
    color: #fff;
    background-color: var(--secondary-color);
}

a.introjs-button.introjs-skipbutton {
    background-color: #fff;
    outline: none;
    border: none;
    text-shadow: none;
    background-image: none;
    color: #fff;
    background-color: var(--secondary-color);
}

a.introjs-button.introjs-prevbutton {
    background-color: #fff;
    outline: none;
    border: none;
    text-shadow: none;
    background-image: none;
    color: #fff;
    background-color: var(--secondary-color);
}


span.introjs-helperNumberLayer {
    background: var(--secondary-color);
}









/* Start Media Quires */



@media(max-width:950px) {
    .upper-nav .upper-nav-content .logo img {
        width: 129px;
        height: 38px;
        object-fit: contain;
    }
    /*
    .upper-nav .upper-nav-content {
        flex-direction: column;
    }*/

    /* nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(2) {
        display: none;
    }

    nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(3) {
        display: none;
    }


    nav .nav-content .nav-elements:nth-child(2) .nav-element:nth-child(1) {
        display: none;
    }


    nav .nav-content .nav-elements:nth-child(2) .nav-element:nth-child(2) {
        display: none;
    }*/

    .page-header .page-header-content {
        flex-direction: column;
    }

        .page-header .page-header-content img {
            width: 100%;
            height: 168px;
            object-fit: contain;
            margin-top: 16px;
            margin-bottom: 15px;
        }

        .page-header .page-header-content .page-header-info h1 {
            font-size: 21px;
        }

    .three-d-open-data .header .search {
        flex-direction: column;
    }

        .three-d-open-data .header .search button {
            width: 100%;
            height: 55px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 8px 0 0 8px;
            outline: none;
            border: none;
            border-radius: 0;
            margin-bottom: 15px;
        }

        .three-d-open-data .header .search .custom-date-input input:nth-child(2) {
            width: 100%;
            height: 70px;
            border-radius: 8px;
            border: 1px solid #e8eef7;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            direction: rtl;
            margin-bottom: 18px;
        }

        .three-d-open-data .header .search .custom-date-input {
            width: 100%;
            position: relative;
            direction: rtl;
        }

    .three-d-open-data .header .search {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
    }


        .three-d-open-data .header .search > select {
            width: 100%;
            height: 55px;
            margin-bottom: 19px;
            outline: none;
            border: none;
            padding: 15px;
            text-align: right;
            font-size: 16px;
            color: #000;
            direction: rtl;
        }

    .three-d-open-data .open-data-stats .stats-header {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 34px;
    }

        .three-d-open-data .open-data-stats .stats-header h1 {
            font-family: Tajawal;
            font-size: 18px;
            font-weight: 700;
            text-align: right;
            color: #26283B;
            margin-bottom: 27px;
        }

    .comments .comments-form .inputs {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        margin-top: 33px;
    }

    .rate-content .rate-content-options .options {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 25px;
        margin-top: 24px;
    }

    footer .upper-footer-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        padding-bottom: 15px;
        border-bottom: 1px solid #E5EAF2;
        padding-top: 15px;
        position: relative;
        z-index: 5;
    }

        footer .upper-footer-content ul {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            margin: 0;
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 13px;
            flex-wrap: wrap;
            justify-content: flex-end;
            margin-top: 18px;
        }

    footer .lower-footer-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        padding-top: 15px;
        padding-bottom: 15px;
        position: relative;
        z-index: 5;
    }

        footer .lower-footer-content ul {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 5px;
            margin: 0;
            flex-wrap: wrap;
            justify-content: flex-end;
            margin-top: 19px;
        }

    .copy-right .copy-right-content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        min-height: 55px;
        padding-top: 15px;
        padding-bottom: 15px;
        gap: 11px;
    }

    footer .curve-2 img {
        position: absolute;
        bottom: 0;
        width: 100%;
        top: -22px;
        left: 0;
        right: 0;
        z-index: 2;
        background-color: transparent;
    }

    footer .curve-1 img {
        width: 100%;
        top: -23px;
        position: absolute;
        right: 0;
        z-index: 1;
    }

    .advice-page .advice-header .search input, .questionnaires-page .questionnaires-header .search input {
        width: 100%;
        height: 65px;
        border-radius: 0 8px 8px 0;
        border: 1px solid #D4DDE9;
        padding-left: 20px;
        padding-right: 20px;
        direction: rtl;
    }

    .advice-page .advice-header, .questionnaires-page .questionnaires-header {
        margin-bottom: 50px;
        margin-top: 50px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
    }

        .advice-page .advice-header .search, .questionnaires-page .questionnaires-header .search {
            position: relative;
            display: flex;
            flex-direction: row;
            align-items: center;
            width: 100%;
            margin-bottom: 18px;
        }

        .advice-page .advice-header .btns, .questionnaires-page .questionnaires-header .btns {
            height: 65px;
            border: 1px solid #D4DDE9;
            border-radius: 8px;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            width: 100%;
        }

        .advice-page .advice-header .btns, .questionnaires-page .questionnaires-header .btns {
            height: 152px;
            border: 1px solid #D4DDE9;
            border-radius: 8px;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            width: 100%;
        }

            .advice-page .advice-header .btns button, .questionnaires-page .questionnaires-header .btns button {
                width: 100%;
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                color: #000;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 700;
                text-align: center;
                background-color: transparent;
                outline: none;
                border: none;
                height: 50px;
            }

    .rate-content .rate-content-options {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
    }

    .advice-inner-page .header h3 {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 5px;
        font-size: 15px;
        width: 100%;
        justify-content: center;
        margin-top: 17px;
        margin-bottom: 28px;
    }

    /*.speeds-page .header .search {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
    }*/

    /*        .speeds-page .header .search > input {
            width: 100%;
            height: 61px;
            border-radius: 0 10px 10px 0;
            outline: none;
            border: none;
            padding: 15px;
            text-align: right;
            font-size: 16px;
            color: #000;
        }*/

    .speeds-page .header .search > select {
        width: 100%;
        height: 50px;
        border-radius: 0 10px 10px 0;
        outline: none;
        border: none;
        padding: 15px;
        text-align: right;
        font-size: 16px;
        color: #000;
        direction: rtl;
    }


    .speeds-page .header .search .custom-date-input input:nth-child(2) {
        width: 100%;
        height: 56px;
        border-radius: 8px;
        border: 1px solid #e8eef7;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        direction: rtl;
    }

    .speeds-page .header .search .custom-date-input {
        width: 100%;
        position: relative;
        direction: rtl;
    }

    /* .speeds-page .header .search {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        gap: 13px;
        padding-top: 27px;
        padding-bottom: 27px;
    }*/

    /*.speeds-page .header .search button {
            width: 100%;
            height: 60px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 8px 0 0 8px;
            outline: none;
            border: none;
            border-radius: 0;
        }*/


    .inner-page .inner-text {
        margin: 0;
        margin-top: -60px;
        background-color: #fff;
        position: relative;
        padding: 20px;
        border-radius: 10px;
        border: 1px solid #EAEAEA;
    }

    .dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        height: fit-content;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
    }

        .dates-toggle-btns .months button {
            width: 150px;
            height: 63px;
            border: none;
            outline: none;
            background-color: transparent;
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: center;
            color: #000000;
        }

    .dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        height: fit-content;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
        overflow-x: scroll;
    }

        .dates-toggle-btns .months {
            display: flex;
            flex-direction: row;
            align-items: center;
            width: 1300px;
        }

    .blog-page .blog-item {
        width: 100%;
        min-height: 465px;
        position: relative;
        margin-left: 0;
        margin-right: 0;
        margin: 0;
        margin-bottom: 60px;
    }

    .contact-us-page .contact-options .option {
        min-height: 182px;
        width: 100%;
        border: 1px solid #D4DDE9;
        box-shadow: 0px 0px 14px 0px #00000008;
        border-radius: 8px;
        padding: 13px 27px;
        margin-bottom: 28px;
    }

    /*    .contact-us-page .contact-us-footer .left {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
    }*/

    /*    .contact-us-page .contact-us-footer .right {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 8px;
    }*/

    /*.contact-us-page .police-stations .stations .station {*/
    /* width: 50%;*/
    /*margin-bottom: 40px;
        margin-top: 40px;
        height: 150px;
        justify-content: space-between;
        display: flex;
        flex-direction: column;
        align-items: flex-end;*/
    /* padding: 50px;*/
    /*padding-bottom: 20px;
        padding-top: 20px;
        padding: 14px;
    }*/

    .event-inner-page .event-text {
        margin: 0;
        margin-top: -60px;
        background-color: #fff;
        position: relative;
        padding: 20px;
        border-radius: 10px;
        border: 1px solid #EAEAEA;
    }


        .event-inner-page .event-text .header {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 20px;
            gap: 29px;
        }

    .events-page .events-dates-toggle-btns .months {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
        width: 1300px;
    }

    .events-page .events-dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        height: 63px;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
        overflow-x: scroll;
    }

    .events-page .events-dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        height: fit-content;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
        overflow-x: scroll;
    }

    .events-page .event-item {
        width: 100%;
        min-height: 400px;
        position: relative;
        margin-left: 40px;
        margin-right: 27px;
        margin: 0;
        margin-bottom: 30px;
    }

    .faqs .faqs-content .question .head h1 {
        font-size: 15px;
        font-weight: 700;
        text-align: left;
        color: #26283B;
        margin-left: 17px;
    }

    .history-page .history {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        gap: 30px;
        margin-bottom: 60px;
    }


    .news-moving-slider .news-moving-content h2 {
        width: 20%;
    }


    .landing .landing-content .toggle-screen-btns button {
        font-size: 13px;
    }

    .landing .screens .screen .new-about-police .images-slider {
        height: auto;
    }

        .landing .screens .screen .new-about-police .images-slider .slide {
            height: 244px;
        }

    .landing .screens .screen .new-about-police {
        height: 261px;
    }

/*    .services-header {
        margin-top: 21px;
        margin-bottom: 30px;
    }*/

        .services-header .service-header-content {
            display: flex;
            flex-direction: column-reverse;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 30px;
            gap: 17px;
        }
        /*
            .services-header .service-header-content .options {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 18px;
                flex-wrap: wrap;
                justify-content: space-between;
            }*/

        .services-header .toggle-services-categories-btns {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            justify-content: space-between;
            gap: 1px;
            flex-wrap: wrap;
        }

    .services .services-categories .category .category-services-slider .slide .service {
        width: 100%;
    }

    .landing .screens .screen .our-services .landing-services-search .input {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        width: 380px;
        height: 57PX;
        position: relative;
    }

    .landing .screens .screen .our-services .landing-services-search a {
        width: 229px;
        height: 57px;
        background-color: var(--primary-color);
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        color: #fff;
        border-radius: 43px;
        font-size: 14px;
    }

    /*    .landing .screens .screen .our-services .landing-services .services-slider .slide .service {
        width: 350px;
        min-height: 226px;
        background-color: #fff;
        border-radius: 8px;
        padding: 28px 28px 28px 28px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin-left: 0;
        gap: 18px;
        margin-left: 15px;
        margin-right: 3px;
    }*/

    /*.laws-and-legistations .laws-content .laws-search {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
    }*/

    /* Modefied by Yosef on 27-4-2025 */
    /* .landing .screens .screen .our-services .landing-services .services-slider .slide {
        width: fit-content !important;
    }*/

    .landing .screens .screen .our-services .identity-number-search .input {
        position: relative;
        width: 370px;
        height: 50px;
    }

    .landing .screens .screen .our-services .identity-number-search {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
        margin-top: 35px;
    }

    .landing .screens .screen .last-news .all-news .news-slider .slide .blog {
        width: 100%;
        min-height: 465px;
        position: relative;
        margin-left: 0;
        margin-right: 0;
    }



    .landing .screens .screen .support-help .options {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        position: relative;
        gap: 0px;
        width: 100%;
        justify-content: space-between;
    }


        .landing .screens .screen .support-help .options a {
            width: 48%;
        }

        .landing .screens .screen .support-help .options a {
            width: 48%;
            margin-bottom: 18px;
        }

            .landing .screens .screen .support-help .options a .option h1 {
                font-weight: 500;
                font-size: 17px;
                text-align: right;
                width: 100%;
                color: #26283b;
            }

    .landing .screens .screen .support-help {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 844px;
    }

        .landing .screens .screen .support-help .ask-question input {
            width: 98%;
            height: 57px;
            border-radius: 50px;
            color: #000;
            border: 1px solid #C8D7EE;
            padding-right: 10px;
            direction: rtl;
            font-size: 15px;
            outline: none;
            padding-right: 27px;
            padding-left: 35px;
        }

        .landing .screens .screen .support-help .ask-question {
            position: relative;
            margin-top: 35px;
            display: flex;
            flex-direction: row;
            align-items: center;
            width: 100%;
            justify-content: center;
            gap: 15px;
            margin-bottom: 35px;
        }

    .landing .screens .screen .last-news .all-news .news-slider {
        position: relative;
        width: 100%;
        height: fit-content;
    }

        .landing .screens .screen .last-news .all-news .news-slider .slide .blog {
            width: 350px;
            min-height: 465px;
            position: relative;
            margin-left: 0;
            margin-right: 0;
        }

        .landing .screens .screen .last-news .all-news .news-slider .slide .blog {
            width: 350px;
            min-height: 465px;
            position: relative;
            margin-left: 30px;
            margin-right: 3px;
        }


    .laws-and-legistations .laws-content .laws-search > input {
        width: 100%;
    }

    .laws-and-legistations .laws-content .laws-search .custom-date-input {
        width: 100%;
        position: relative;
        direction: rtl;
        height: 65px;
    }

        .laws-and-legistations .laws-content .laws-search .custom-date-input input:nth-child(2) {
            width: 100%;
            height: 62px;
            border-radius: 8px;
            border: 1px solid #e8eef7;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            direction: rtl;
        }

    /*.laws-and-legistations .laws-content .laws-search {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        padding-top: 52px;
    }*/

    /* .laws-and-legistations .laws-content .laws-search button {
            width: 100%;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 8px 0 0 8px;
            outline: none;
            border: none;
            border-radius: 0;
            margin-top: 22px;
        }*/

    .laws-and-legistations .laws-content .laws-search > label {
        font-size: 15px;
        font-weight: 500;
        text-align: right;
        color: #26293E;
        margin-top: 30px;
        margin-bottom: 10px;
    }

    .page-header .page-header-content .page-header-info ul {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 10px;
        justify-content: flex-end;
        text-align: right;
    }

    .news-inner-page .news-text {
        margin: 0;
        margin-top: -60px;
        background-color: #fff;
        position: relative;
        padding: 20px;
        border-radius: 10px;
        border: 1px solid #EAEAEA;
    }


    .news-page .news-categories-toggle-btns {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        border-radius: 8px;
        overflow-x: scroll;
    }


        .news-page .news-categories-toggle-btns .btns {
            width: 1200px;
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            height: 63px;
            border: 2px solid #E8EEF7;
            border-radius: 8px;
        }

            .news-page .news-categories-toggle-btns .btns button {
                width: 130px;
                height: 63px;
                border: none;
                outline: none;
                background-color: transparent;
                font-family: Tajawal;
                font-size: 17px;
                font-weight: 500;
                text-align: center;
                color: #000000;
            }

    .news-page .news-dates-toggle-btns .months button {
        width: 103px;
        height: 63px;
        border: none;
        outline: none;
        background-color: transparent;
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        text-align: center;
        color: #000000;
    }

    .news-page .news-dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        height: 63px;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
        overflow-x: scroll;
    }

    .news-page .news-item {
        width: 100%;
        min-height: 465px;
        position: relative;
        margin-left: 0;
        margin-right: 0;
    }

    .data-form-content .data-form .inputs {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 20px;
    }

    .organization-page .organization .line-hor {
        display: none;
    }

    .organization-page .organization .line-ver {
        display: none;
    }

    .polls-page .polls-header {
        margin-bottom: 50px;
        margin-top: 50px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
    }

        .polls-page .polls-header .search {
            position: relative;
            display: flex;
            flex-direction: row;
            align-items: center;
            width: 100%;
            margin-bottom: 17px;
        }

            .polls-page .polls-header .search input {
                width: 100%;
                height: 65px;
                border-radius: 0 8px 8px 0;
                border: 1px solid #D4DDE9;
                padding-left: 20px;
                padding-right: 20px;
                direction: rtl;
            }

    .polls-page .form-element .options button:nth-child(1) {
        width: 164px;
        height: 45px;
        border-radius: 8px;
        background-color: var(--primary-color);
        color: #fff;
        outline: none;
        border: none;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: center;
        gap: 15px;
    }

    .polls-page .poll-results {
        height: fit-content;
        border-radius: 10px;
        padding: 30px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 26px;
        border: 1px solid #D4DDE9;
    }

        .polls-page .poll-results .result h2 {
            font-family: Tajawal;
            font-size: 17px;
            font-weight: 500;
            text-align: right;
            width: 42%;
        }

    /*    .publications-page .header .search {
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        margin-bottom: 40px;
        background-color: #f5f7fa;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        padding-top: 27px;
        padding-bottom: 27px;
    }
*/
    .publications-page .header .search .custom-date-input {
        width: 100%;
        position: relative;
        direction: rtl;
    }
        /*
        .publications-page .header .search > input {
            width: 100%;
            height: 65px;
            border-radius: 0 10px 10px 0;
            outline: none;
            border: none;
            padding: 15px;
            text-align: right;
            font-size: 16px;
            color: #000;
            margin-bottom: 21px;
        }*/

        .publications-page .header .search .custom-date-input input:nth-child(2) {
            width: 100%;
            height: 68px;
            border-radius: 8px;
            border: 1px solid #e8eef7;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            direction: rtl;
            margin-bottom: 18px;
            margin-top: 18px;
        }

    /*        .publications-page .header .search button {
            width: 100%;
            height: 56px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 8px 0 0 8px;
            outline: none;
            border: none;
            border-radius: 0;
        }*/

    .publication-sub-page .publication-dates-toggle-btns .months button {
        width: 150px;
        height: 63px;
        border: none;
        outline: none;
        background-color: transparent;
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        text-align: center;
        color: #000000;
    }

    .publication-sub-page .publication-dates-toggle-btns .months {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 1300px;
    }

    .publication-sub-page .publication-dates-toggle-btns {
        width: 100%;
        display: flex;
        flex-direction: row;
        align-items: center;
        height: 63px;
        border: 2px solid #E8EEF7;
        border-radius: 8px;
        margin-top: 25px;
        margin-bottom: 28px;
        border-radius: 8px;
        overflow: hidden;
        overflow-x: scroll;
    }

    .publication-sub-page .publication-item {
        width: 100%;
        min-height: 610px;
        position: relative;
        margin-left: 0;
        margin-right: 0;
    }

    .questionnaires-inner .questionnaires-inner-content h1 {
        font-family: Tajawal;
        font-size: 19px;
        font-weight: 700;
        text-align: right;
        color: #000000;
        margin-bottom: 60px;
    }

    .service-apply .service-apply-options {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
        margin-top: 25px;
        margin-bottom: 25px;
        flex-wrap: wrap;
    }

    .service-apply .apply-service-form .inputs .normal-input div {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 15px;
        margin-bottom: 19px;
    }

    .service-cataloge-page .services-cataloge-search {
        width: 100%;
        overflow-x: scroll;
    }

        .service-cataloge-page .services-cataloge-search .sub-services-toggle-btns {
            display: flex;
            flex-direction: row-reverse;
            align-items: center;
            width: 1300px;
        }

            .service-cataloge-page .services-cataloge-search .sub-services-toggle-btns button {
                height: 65px;
                background-color: #fff;
                color: #000;
                font-family: Tajawal;
                font-size: 15px;
                font-weight: 700;
                text-align: center;
                width: 100%;
                border: none;
                outline: none;
                width: 192px;
            }

        .service-cataloge-page .services-cataloge-search > button {
            width: 60px;
            height: 65px;
            background: var(--primary-color);
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            border-radius: 8px 0 0 8px;
            outline: none;
            border: none;
            padding-right: 40px;
            padding-left: 40px;
        }

    .service-cataloge-page .sub-services-screens .screen a {
        width: 49%;
    }

    .service-details .service-details-options {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
        margin-top: 25px;
        margin-bottom: 25px;
    }

    .services-page .services-content a {
        width: 49%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin-bottom: 25px;
        margin-top: 25px;
        padding: 15px;
    }

    .support-form .support-form-content .data-form .inputs {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        gap: 20px;
        margin-bottom: 16px;
    }

    .voice-search .voice-search-content .content {
        display: flex;
        flex-direction: column;
        flex-direction: column;
        align-items: center;
        justify-content: space-between;
        height: 100%;
    }

        .voice-search .voice-search-content .content p {
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            line-height: 22.98px;
            text-align: center;
            color: #fff;
            width: 100%;
            z-index: 1;
        }

    .voice-search .voice-search-content {
        z-index: 1;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        height: 58%;
        background-color: #000;
        border-radius: 11px;
        padding: 30px;
    }

    .select2 {
        width: 100% !important;
        height: 44px;
        border-radius: 8px;
        border: 1px solid #e8eef7;
        direction: ltr;
    }

    .advice-inner-page .header {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 32px;
        flex-wrap: wrap;
    }
}


/* Ar Styles */


.publications-page .row {
    direction: ltr;
}

.publication-sub-page .row {
    direction: ltr;
}


/* Google transalte  */


.goog-te-gadget img {
    vertical-align: middle;
    border: none;
    display: none !important;
}


.goog-te-gadget-simple .VIpgJd-ZVi9od-xl07Ob-lTBxed span {
    border-left: 0 !important;
}

.goog-te-gadget-simple {
    background-color: #FFF;
    border-left: 1px solid #D5D5D5;
    border-top: 1px solid #9B9B9B;
    border-bottom: 1px solid #E8E8E8;
    border-right: 1px solid #D5D5D5;
    font-size: 10pt;
    display: inline-block;
    padding-top: 1px;
    padding-bottom: 2px;
    cursor: pointer;
    width: 100% !important;
    height: 45px !important;
    border-radius: 5px !important;
    border: 1px solid #e0e0e0 !important;
    padding: 11px !important;
}

    .goog-te-gadget-simple .VIpgJd-ZVi9od-xl07Ob-lTBxed {
        color: #000;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

.VIpgJd-ZVi9od-xl07Ob-OEVmcd {
    z-index: 10000002;
    border: none;
    position: fixed;
    box-shadow: 0 3px 8px 2px #999;
    width: 311px !important;
    box-shadow: none !important;
}

.VIpgJd-ZVi9od-vH1Gmf {
    background-color: #FFF;
    text-decoration: none;
    border: 1px solid #6B90DA;
    overflow: hidden;
    padding: 4px;
    width: 100% !important;
}

.VIpgJd-ZVi9od-vH1Gmf {
    background-color: #FFF;
    text-decoration: none;
    border: 1px solid #6B90DA;
    overflow: hidden;
    padding: 4px;
    width: 100% !important;
    border: none;
    box-shadow: none !important;
    border: 1px solid #e3e3e3 !important;
    border-radius: 6px !important;
}

.VIpgJd-ZVi9od-vH1Gmf-ibnC6b div, .VIpgJd-ZVi9od-vH1Gmf-ibnC6b:link div, .VIpgJd-ZVi9od-vH1Gmf-ibnC6b:visited div, .VIpgJd-ZVi9od-vH1Gmf-ibnC6b:active div {
    color: #000 !important;
    background: #FFF;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
}


a.VIpgJd-ZVi9od-vH1Gmf-ibnC6b {
    transition: 0.5s;
}

    a.VIpgJd-ZVi9od-vH1Gmf-ibnC6b:hover {
        background-color: var(--primary-color) !important;
    }

.VIpgJd-ZVi9od-vH1Gmf-ibnC6b div, .VIpgJd-ZVi9od-vH1Gmf-ibnC6b:link div, .VIpgJd-ZVi9od-vH1Gmf-ibnC6b:visited div, .VIpgJd-ZVi9od-vH1Gmf-ibnC6b:active div {
    color: #000 !important;
    background: #FFF;
}

/* Modal Styles */
.modal {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.4);
    padding-top: 60px;
    z-index: 100000;
}

.modal-content {
    background-color: #fefefe;
    margin: 5% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 325px;
}



    .modal-content h2 {
        text-align: center;
        font-size: 21px;
        font-weight: 500;
        margin-bottom: 30px;
    }

    .modal-content p {
        text-align: right;
        font-size: 18px;
        font-weight: 500;
        margin-bottom: 44px;
    }


    .modal-content .btns {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
        justify-content: space-between;
    }

        .modal-content .btns button {
            width: 110px;
            height: 44px;
            border: none;
            outline: none;
            border-radius: 8px;
            background-color: transparent;
            outline: none;
            font-size: 17px;
        }


            .modal-content .btns button:nth-child(1) {
                background-color: #494334;
                color: #fff;
            }


            .modal-content .btns button:nth-child(2) {
                background-color: #000;
                color: #fff;
            }


.share-buttons {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
}



    .share-buttons a {
        margin: 10px;
        display: inline-block;
        background-color: #eee;
        width: 100%;
        height: 40px;
        border-radius: 22px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        color: #000;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding-right: 16px;
    }

    .share-buttons img {
        width: 24px;
        height: 24px;
    }

.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

    .close:hover,
    .close:focus {
        color: black;
        text-decoration: none;
        cursor: pointer;
    }

/* Special */

.service-apply .apply-service-form .input-auth .input > div {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 15px;
    margin-top: 10px;
    justify-content: space-between;
    width: 100%;
    border: none;
}

    .service-apply .apply-service-form .input-auth .input > div > div:not(.ajax__calendar) {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 15px;
        margin-top: 10px;
        justify-content: space-between;
        width: 100% !important;
        border: none;
    }

#ctl00_ContentPlaceHolder1_ctl41 div {
    margin: 0 !important;
    padding: 0 !important;
}

.RadMap .k-marker::before {
    position: absolute;
    display: block;
    width: 1em;
    height: 1em;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    line-height: 1;
    overflow: hidden;
    font-family: WebComponentsIcons,monospace;
    font-size: 28px;
    text-indent: 0;
    text-align: center;
    color: #000;
    margin: auto;
    position: relative;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%,-50%) !important;
}



.RadComboBox_Default .rcbInner {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: #fff !important;
    border-radius: 3px !important;
    width: 97% !important;
    height: 52px !important;
    border: 1.46px solid #DAE2EE !important;
    outline: none !important;
    color: #000 !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    padding: 7px !important;
    direction: rtl !important;
    border: none !important;
    width: 100% !important;
}



.RadComboBox .rcbInner {
    padding: 4px 2em 4px 10px !important;
    border-width: 1px !important;
    border-style: solid !important;
    background-repeat: repeat-x !important;
    background-position: 0 0 !important;
    display: flex !important;
    position: relative !important;
    /* Modefied by Yosef on 21-4-2025 */
    flex-direction: row-reverse !important;
    align-items: center !important;
    gap: 5px !important;
    border: 1px solid #d7d7d7 !important;
}

.RadComboBox_Default .rcbActionButton {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: #e6e6e6 !important;
    background-image: linear-gradient(white, #e6e6e6) !important;
    border-radius: 0 3px 3px 0 !important;
}

.RadComboBox .rcbActionButton {
    padding: 4px !important;
    width: 1.42857143em !important;
    height: 1.42857143em !important;
    color: inherit !important;
    border-width: 0 0 0 1px !important;
    border-style: solid !important;
    box-sizing: content-box !important;
    background-color: transparent !important;
    background-repeat: repeat-x !important;
    background-position: 0 0 !important;
    font: inherit !important;
    position: relative !important;
    top: 0 !important;
    bottom: 0 !important;
    right: 0 !important;
    left: auto !important;
    outline: 0 !important;
    width: 45px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    outline: none !important;
}

.service-apply .apply-service-form .input-auth .input textarea {
    width: 100% !important;
    height: 170px !important;
    border: 1.46px solid #DAE2EE !important;
    outline: none !important;
    color: #000 !important;
    font-size: 16px !important;
    border-radius: 8px !important;
    padding: 7px !important;
    direction: rtl !important;
    padding-right: 15px !important;
}

span.rcbInner.rcbHovered {
    background-color: transparent !important;
    background-image: none !important;
}

.RadComboBoxDropDown .rcbItem {
    padding: 4px 10px !important;
    background-repeat: repeat-x !important;
    text-align: left !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
}

    .RadComboBoxDropDown .rcbItem > label {
        margin: -4px -10px !important;
        padding: 4px 10px !important;
        font-weight: normal !important;
        display: block !important;
        display: flex !important;
        flex-direction: row-reverse !important;
        align-items: center !important;
        justify-content: flex-end !important;
    }

input[type="button"] {
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--primary-color) !important;
    border-radius: 8px !important;
    height: 58px !important;
    color: #fff !important;
    gap: 15px !important;
    font-family: Tajawal !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    text-align: center !important;
    color: #FFFFFF !important;
    color: #fff !important;
    border: none !important;
    outline: none !important;
    margin-top: 18px !important;
    width: 250px !important;
}


.RadMap .k-navigator > .k-button {
    padding: 0 !important;
    width: 18px !important;
    height: 18px !important;
    line-height: normal !important;
    border-color: transparent !important;
    border-radius: 50% !important;
    color: #fff !important;
    background: 0 !important;
    box-shadow: none !important;
    position: absolute !important;
}

.RadMap .k-zoom-control {
    margin: 14px !important;
    border-width: 0 !important;
    vertical-align: middle !important;
    display: inline-block !important;
    box-shadow: none !important;
    width: 150px !important;
    color: #000 !important;
}

    .RadMap .k-zoom-control .k-button {
        padding: 2px !important;
        width: 1.42857143em !important;
        height: 1.42857143em !important;
        box-sizing: content-box !important;
        background-color: inherit !important;
        background: inherit !important;
        color: #000 !important;
    }


.k-map .k-zoom-control .k-button {
    width: auto !important;
    height: auto !important;
}

.RadMap .k-navigator > .k-button {
    padding: 0;
    width: 18px !important;
    height: 18px !important;
    line-height: normal !important;
    border-color: transparent !important;
    border-radius: 50% !important;
    color: #fff !important;
    background: 0 !important;
    box-shadow: none !important;
    position: absolute !important;
}


.RadMap_Default .k-navigator {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.RadUpload_Default .ruSelectWrap .ruButton {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: #e6e6e6 !important;
    background-image: linear-gradient(white, #e6e6e6) !important;
    border-radius: 3px !important;
    width: 100px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--primary-color) !important;
    border-radius: 8px !important;
    height: 58px !important;
    color: #fff !important;
    gap: 15px !important;
    font-family: Tajawal !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    text-align: center !important;
    color: #FFFFFF !important;
    height: 41px !important;
}

.RadUpload_Default .ruSelectWrap .ruFakeInput {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: #fff !important;
    width: 100% !important;
    height: 40px !important;
    border-radius: 5px !important;
    border: 1px solid #dfdfdf !important;
}

.RadUpload .ruFileWrap.ruStyled {
    display: inline-block !important;
    overflow: hidden !important;
    padding-bottom: .5px !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
}

.RadUpload_Default .ruDropZone {
    border-color: #b3b3b3 !important;
    color: #333 !important;
    background-color: #e6e6e6 !important;
    border-radius: 3px !important;
    margin-top: 57px !important;
    position: relative !important;
    width: 100% !important;
    height: 150px !important;
    background-color: transparent !important;
    border: 3px dotted #d6d6d6 !important;
}

.RadUpload .ruInputs {
    margin: 0 !important;
    padding: 0;
    list-style-type: none !important;
    width: 100% !important;
    direction: rtl;
}


.RadComboBox_Default .rcbReadOnly {
    border-color: #b3b3b3;
    color: #333;
    background-color: #e6e6e6;
    background-image: none !important;
}

.RadUpload .ruSelectWrap {
    display: inline-block !important;
    width: 100% !important;
}

.RadUpload_Default .ruDropZone {
    border-color: #b3b3b3;
    color: #333;
    background-color: #e6e6e6;
    border-radius: 3px;
    margin-top: 31px !important;
    border-radius: 26px !important;
}


.service-apply .apply-service-form .input-auth .input > div {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 15px;
    margin-top: 10px;
    justify-content: space-between;
    width: 100%;
    border: none;
}

    .service-apply .apply-service-form .input-auth .input > div > div:not(.ajax__calendar) {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 15px;
        margin-top: 10px;
        justify-content: space-between;
        width: 100%;
        border: none;
    }

.RadComboBoxDropDown_Default .rcbHovered {
    color: #000;
    background-color: #c2c2c2;
    text-align: left !important;
}

#tidio-chat {
    display: none;
}


.share-link {
    margin-top: 15px;
    width: 100%;
    position: relative;
}

    .share-link input {
        width: 100%;
        height: 40px;
        border-radius: 50px;
        border: none;
        outline: none;
        background-color: transparent;
        border: 1px solid #0000002b;
        padding-left: 10px;
    }

    .share-link button {
        position: absolute;
        right: 5px;
        top: 18%;
        transform: translateX(-50%);
        border: none;
        outline: none;
        background-color: transparent;
        font-size: 22px;
    }


.icon {
    transition: 0.2s;
    filter: opacity(1);
    scale: 1;
}

/*    .icon img:hover {
        background: rgba(255, 255, 255, 0.05) !important;
        box-shadow: 0 5px 12px rgba(0, 0, 0, 0.55) !important;
    }*/


.valid {
    border: 1px solid #4CAF50;
    border-radius: 5px;
}

.valid {
    border: 1px solid #4CAF50 !important;
    border-radius: 5px !important;
}

.invalid {
    border: 1px solid #F44336 !important;
    border-radius: 5px !important;
}







.RadSearchBox_Silk .rsbInner {
    border-color: #c4c4c4;
    color: #3b3b3b;
    background-color: var(--secondary-color) !important;
    border: none !important;
    outline: none !important;
    color: #fff !important;
    direction: rtl !important;
}

/*.RadSearchBox .rsbInput {
    height: 1.42857143em;
    margin: 3px .25em;
    padding: 0;
    padding-right: 0px;
    width: 100%;
    border: 0;
    color: inherit;
    background: 0;
    font: inherit;
    font-style: inherit;
    font-size: inherit;
    display: inline-block;
    vertical-align: middle;
    direction: rtl !important;
    height: 33px !important;
    padding-right: 8px !important;
    font-size: 14px !important;
}*/

/*.rsbPopup .rsbListItem {
    *zoom: 1;
    margin: 0;
    padding: 4px 10px;
    min-height: 1em;
    text-align: right !important;
}*/

.speeds-table .icon {
    width: 30px;
    height: 30px;
    object-fit: cover;
    background: none !important;
}


/* English Css */

nav {
    direction: rtl;
}


    nav .nav-content {
        direction: rtl;
    }


        nav .nav-content .nav-elements .nav-element > a {
            text-align: left;
            /* direction: ltr;
            direction: ltr;*/
        }

        nav .nav-content .nav-elements .nav-element .search-input {
            direction: ltr;
        }

.side-nav.active {
    left: 0;
    direction: ltr;
    z-index: 999999;
}

.side-nav {
    left: -1000px;
    direction: ltr;
}

    .side-nav .side-nav-content > button {
        right: -40px;
        left: inherit;
        border-radius: 0px 6px 6px 0px;
        direction: ltr;
    }

nav .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content h4 {
    text-align: left;
    direction: ltr;
}

nav .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content select {
    direction: ltr;
    direction: ltr;
}

.page-header {
    direction: rtl;
}

.three-d-open-data .header .search {
    direction: rtl;
}


    .three-d-open-data .header .search > label {
        text-align: left;
        direction: ltr;
    }

.three-d-open-data .open-data-stats .stats-header {
    direction: rtl;
}

.inputs .input {
    direction: rtl;
}

nav .nav-content .nav-elements {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    direction: rtl;
}

i.la-angle-left,
i.la-angle-right {
    transform: rotate(180deg);
}

.page-header .page-header-content .page-header-info ul {
    direction: ltr;
}

.advice-page .advice-header .search input, .questionnaires-page .questionnaires-header .search input {
    direction: ltr;
}

.advice-page .advice .options button, .questionnaires-page .questionnair .options button {
    width: 153px;
}

.advice-page .advice h1, .questionnaires-page .questionnair h1 {
    text-align: left;
}

.page-header .page-header-content .page-header-info h1 {
    direction: ltr;
    text-align: left;
}

.advice-inner-page .advice-text {
    direction: ltr;
}

.content-table table tr {
    direction: rtl;
    text-align: left;
}

    .content-table table tr td h4 {
        font-family: Tajawal;
        font-size: 17px;
        font-weight: 500;
        text-align: right;
        color: #26283B;
        text-align: left;
        direction: ltr;
        line-height: 27px;
    }

.page-header .page-header-content .page-header-info ul {
    flex-direction: row;
}


.inner-page .inner-text h2 {
    direction: ltr;
    text-align: left;
}

.inner-page .inner-text p {
    direction: ltr;
    text-align: left;
}
/*
.years {
    position: relative;
    height: 152px;
}*/


.blog-page .blog-item .text h1 {
    text-align: left;
}

.contact-us-page .contact-options .option h3 {
    text-align: left;
}

.contact-us-page .contact-options .option h2 {
    text-align: left;
}

.contact-us-page .police-stations .stations .station h2 {
    text-align: left;
}

.contact-us-page .police-stations h1 {
    text-align: left;
}


.contact-us-page .contact-us-footer {
    direction: rtl;
}

.policy-page .policy-page-text {
    direction: ltr;
}

.event-inner-page .event-text h2 {
    text-align: left;
}

.event-inner-page .event-text p {
    text-align: left;
}

.events-page .event-item .text {
    direction: rtl;
}



i.la-arrow-left,
i.la-arrow-right {
    transform: rotate(180deg);
}


.faqs .faqs-content .question .head {
    direction: rtl;
}

    .faqs .faqs-content .question .head h1 {
        direction: ltr;
    }

.faqs .faqs-content .question .body p {
    direction: ltr;
    text-align: left;
}

.faqs .faqs-content .question .body .form-element {
    direction: ltr;
}

.faqs .faqs-content .question .body label {
    text-align: left;
    width: 100%;
}


.faqs .faqs-content .question .body textarea {
    text-align: left;
}

/*input {
    padding-right: 15px !important;
    text-align: left !important;
    padding-left: 10px !important;
    direction: ltr !important;
}*/

.commander-talk .text {
    color: #26283B;
    direction: ltr;
    text-align: left;
}

    .commander-talk .text h2 {
        text-align: left;
    }

    .commander-talk .text h1 {
        text-align: left;
    }

.history-page .history .text {
    direction: ltr;
}

.news-moving-slider .news-moving-content h2 {
    border-right: 2px solid #edf2f8;
    left: 0;
    right: inherit;
    border-left: inherit;
    padding-right: 10px;
    padding-left: 15px;
    width: 12%;
}


.landing .screens .screen .our-services .landing-services-search .input button {
    right: 30px;
    left: inherit;
}

.landing .screens .screen .last-news .all-news .news-slider .slide .blog .text p {
    text-align: left;
}

.landing .screens .screen .support-help .options a {
    width: 32.25%;
}


    .landing .screens .screen .support-help .options a .option h1 {
        text-align: left;
    }


    .landing .screens .screen .support-help .options a .option h2 {
        text-align: left;
    }

.landing .screens .screen .support-help .ask-question button {
    right: 30px;
    left: inherit;
}

.services-header .toggle-services-categories-btns {
    direction: rtl;
}

.services .services-categories .category .category-services-slider .slide .service h1 {
    text-align: left;
}

.services .services-categories .category .category-services-slider .slide .service a {
    text-align: left;
}

.services .services-categories .category .category-services-slider .slide .service {
    width: 214px;
}

.laws-and-legistations .laws-content .law {
    direction: rtl;
}

    .laws-and-legistations .laws-content .law h1 {
        text-align: left;
    }


.container .row {
    flex-direction: row;
}

.media-page .media-item .text h1 {
    text-align: left;
}

.news-inner-page .news-text p {
    text-align: left;
    direction: ltr;
}

.news-inner-page .news-text h2 {
    direction: ltr;
    text-align: left;
}

.news-page .news-item .text p {
    text-align: left;
}

label {
    direction: ltr !important;
}

textarea {
    padding-right: 15px !important;
    text-align: left !important;
    padding-left: 10px !important;
    direction: ltr !important;
}

select {
    padding-right: 15px !important;
    text-align: left !important;
    padding-left: 10px !important;
    direction: ltr !important;
}

.organization-page .organization h2 {
    text-align: left;
}

.overview-page .text h1 {
    text-align: left;
    width: 100%;
}

.overview-page .text p {
    text-align: left;
    direction: ltr;
}

.polls-page .form-element {
    direction: ltr;
}

.polls-page .polls-content {
    direction: ltr;
}

.polls-page .poll-results .result h2 {
    text-align: left;
}

.publication-sub-page .publication-item .text p {
    text-align: left;
}

.questionnaires-inner .questionnaires-inner-content {
    direction: ltr;
}

    .questionnaires-inner .questionnaires-inner-content .inputs h2 {
        text-align: left;
        direction: ltr;
    }

.inputs .input {
    direction: ltr;
}

.input > label {
    text-align: left !important;
    width: 90% !important;
}

.service-apply .apply-service-form .inputs label {
    text-align: left;
}

.service-apply .apply-service-form .upload-input > label {
    text-align: left;
}

.service-apply .service-details-header {
    direction: rtl;
    text-align: left;
}

    .service-apply .service-details-header div h1 {
        text-align: left;
    }

    .service-apply .service-details-header div h2 {
        text-align: left;
    }

.service-details .service-description {
    text-align: left;
    direction: rtl;
}

    .service-details .service-description p {
        text-align: left;
        direction: ltr;
    }

.service-details .service-steps .step h2 {
    direction: ltr;
    text-align: left;
}

.service-details .service-steps > h1 {
    text-align: left;
}

.service-details .service-details .detail {
    direction: rtl;
    text-align: left;
}

    .service-details .service-details .detail div h2 {
        text-align: left;
    }


    .service-details .service-details .detail div h1 {
        text-align: left;
    }

    .service-details .service-details .detail div ul li {
        direction: ltr;
        text-align: left;
    }

.content-table table tr th {
    text-align: left;
}

.content-table table tr td h2 {
    text-align: left;
}


.support-form .support-form-content .data-form .upload-input label {
    text-align: left;
}

.usage-analytics-page h1 {
    text-align: left;
}

.services-header .service-header-content {
    flex-direction: row-reverse;
}

    .services-header .service-header-content .options .input button {
        left: inherit;
        right: 15px;
    }


.services .services-categories .normal-eles {
    flex-direction: row;
}

footer .upper-footer-content {
    flex-direction: row-reverse;
}

footer .lower-footer-content {
    flex-direction: row-reverse;
}

    footer .lower-footer-content .clients-stats .stat div h3 {
        text-align: left;
    }

.side-nav .side-nav-content .main-menu > li > button {
    flex-direction: row-reverse;
}

.side-nav .side-nav-content .main-menu .sub-menu ul li a {
    flex-direction: row-reverse;
}

.side-nav .side-nav-content .main-menu > li a {
    flex-direction: row-reverse;
    text-align: left;
}

.side-nav .side-nav-content .main-menu > li .menu-links-options > a {
    text-align: left;
    align-items: flex-start;
}

.side-nav .side-nav-content .main-menu > li .menu-links-options .option {
    flex-direction: row-reverse;
}

.overview-page .text ul li {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 7px;
}

.overview-page .text ul.one-col li {
    width: 100%;
    margin-bottom: 15px;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 15px;
    justify-content: flex-start;
    text-align: left;
}


footer li {
    transition: 0.5s !important;
    scale: 1;
}

    footer li:hover {
        scale: 1.1;
    }


/*My Changes*/

/*Search Icon */
.search-input {
    display: flex;
    align-items: center; /* Align items vertically */
    flex-direction: row-reverse; /* Reverse order to move button left */
    gap: 10px; /* Space between items */
}

    /* Ensure the button (with the search icon) is visible and positioned correctly */
    .search-input button#btnSearch {
        display: flex !important; /* Override display:none */
        align-items: center;
        justify-content: center;
        background: none;
        border: none;
        padding: 5px;
        cursor: pointer;
    }

        /* Adjust the image inside the button */
        .search-input button#btnSearch img {
            width: 20px; /* Adjust icon size */
            height: auto;
        }

    /* Make sure the search input takes remaining space */
    .search-input input[type="search"] {
        flex: 1;
        padding: 8px;
    }

.rsbButtonSearch {
    display: none !important;
}

button#open-side-menu img {
    transform: scaleX(-1);
}



.sendBtn {
    flex-direction: row;
    align-items: center;
    gap: 15px;
}

    .sendBtn .remove-input-data {
        width: 3%;
        height: 39px;
    }


.sendBtn {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
    width: 100%;
}


    .sendBtn > input:nth-child(1) {
        width: 175px;
        height: 46px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        background-color: var(--primary-color);
        font-weight: 500;
        font-size: 15px;
        border-radius: 7px;
        color: #fff;
        padding-left: 10% !important
    }


    .sendBtn > button:nth-child(2) {
        width: 175px;
        height: 46px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        outline: none;
        border: none;
        background-color: #cbc9c9;
        font-weight: 500;
        font-size: 15px;
        border-radius: 7px;
    }



.eval-row {
    padding: 1.5%
}


.divRatings {
    background-color: #d9c4af;
    color: #000;
    border: 1px solid #d9c4af;
    width: auto;
    border-radius: 5px;
    margin: 10px;
}

.qsf-conf-local {
    width: 500px;
    display: inline-block;
    *zoom: 1;
    *display: inline;
    padding: 0 0 0 20px;
}

.spacer {
    padding-bottom: 20px;
}

.select2-container {
    width: 100% !important;
    /* Ensure the dropdown matches the input width */
}

.select2-dropdown {
    position: absolute !important;
    left: 0 !important;
    right: auto !important;
}
/*My Changes*/

/* PDF Download */
.print-title {
    text-align: center;
    padding: 1%;
    display: none;
    text-align: center;
    width: 100%;
    padding-bottom: 5%;
}

@media print {
    .news-inner-page .main-img img {
        object-fit: scale-down; /* Prevents image distortion */
    }

    .no-print {
        display: none !important; /* Hide unwanted elements */
    }

    .print-title {
        text-align: center;
        padding: 1%;
        display: block !important;
    }
}
/* PDF Download */
.faces {
    display: flex;
    flex-direction: row-reverse; /* Ensure faces appear in correct order */
    gap: 10px; /* Space between face icons */
}

.input {
    display: flex;
    align-items: center;
    justify-content: flex-end; /* Align items to the right */
    gap: 15px; /* Space between label and faces */
    direction: rtl; /* Ensure proper right-to-left text flow */
    text-align: left;
}



.custom {
    border: 1px solid #000;
    border-radius: 29px;
    margin: 15px;
    padding: 10px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    border: 2px solid #e8eef7;
    border-radius: 8px;
    gap: 1%;
    transition: 0.5s;
    border: none;
    font-weight: 600;
    direction: ltr;
    flex-direction: row;
    display: flex;
}

.custom2 {
    border: 2px solid #e8eef7;
    border-radius: 8px;
    gap: 1%;
    transition: 0.5s;
    margin: 15px;
    padding: 10px;
    direction: ltr;
    flex-direction: row;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .custom2:hover {
        background-color: #eee;
    }

    .custom2 .icon {
        width: 35px;
        height: 35px;
        object-fit: cover;
        background: none !important;
    }

    .custom2 div button {
        border: none !important;
    }

.contact-us-page .police-stations {
    padding-top: 2%
}

.commentModal {
    width: 50%
}

@media screen and (max-width: 1426px) {

    nav .nav-content {
        flex-direction: column;
        height: auto;
    }


        nav .nav-content .nav-elements {
            flex-direction: column;
            width: 100%;
            gap: 10px;
        }


            nav .nav-content .nav-elements .nav-element {
                gap: 10px;
                width: 100%; /* Adjust width to fit nicely */

                justify-content: center;
            }

    .landing .screens .screen .support-help .options a {
        width: 30.33%;
    }
}


@media screen and (max-width: 954px) {
    nav .nav-content {
        flex-direction: column;
        height: auto;
    }

        nav .nav-content .nav-elements {
            flex-direction: column;
            width: 100%; /* Adjust width for better fit on smaller screens */
            gap: 8px;
        }

            nav .nav-content .nav-elements .nav-element {
                width: 100%; /* Make elements take more space */
                gap: 8px;
                justify-content: center;
            }


            nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(3) {
                display: flex;
                flex-direction: column;
                align-items: center;
                width: 100%;
                height: 60px;
                padding: 19px 0;
                margin-bottom: 10px;
            }

                nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(3) .search-input {
                    display: flex;
                    flex-direction: row;
                    align-items: center;
                    width: 100%;
                    justify-content: center;
                    gap: 10px;
                    top: -10px;
                    position: relative;
                }


                    nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(3) .search-input button {
                        width: 40px; /* Adjust size */

                        height: 40px;
                        padding: 5px;
                    }


                    nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(3) .search-input input {
                        width: 70%; /* Adjust input width */

                        max-width: 250px; /* Prevents it from being too wide */
                    }


                nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(3) .btns {
                    display: flex;
                    justify-content: center;
                    width: 100%;
                }


                    nav .nav-content .nav-elements:nth-child(1) .nav-element:nth-child(3) .btns button {
                        width: 100%;
                        max-width: 250px; /* Ensures button stays within boundaries */
                    }

            nav .nav-content .nav-elements .nav-element #langs-menu {
                transform: translateX(0%);
                left: 0%
            }

    .landing .screens .screen .support-help .options a {
        width: 30.33%;
    }
}

@media screen and (max-width: 1015px) {
    body, html {
        overflow-x: hidden; /* Prevent horizontal scrolling */
        width: 100%;
    }

    * {
        box-sizing: border-box; /* Prevents width miscalculations */
    }

    nav .nav-content {
        max-width: 100%; /* Ensures nav content does not exceed screen width */
        margin: 0 auto; /* Centers content */
    }

    .container, .main-content, .wrapper {
        max-width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
}


.services-form-m {
    direction: ltr;
    padding-top: 10px
}

#divMain {
    width: 40%;
    margin: auto;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    margin-top: 30px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    direction: ltr
}

.info {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #eee;
    padding: 10px 0;
}

    .info strong:first-child {
        min-width: 150px;
        color: #333;
    }

    .info p, .info strong:last-child {
        margin: 0;
        color: #555;
        text-align: right;
        flex: 1;
    }
/* حاوية الستبر */
.stepper-container {
    width: auto;
    float: right;
    height: 375px;
    margin-left: 17px;
    top: -20px;
    position: relative;
}

.RadStepper_Default.k-stepper .k-step-done.k-step-disabled .k-step-indicator, .RadStepper_Default.k-stepper .k-step-done:disabled .k-step-indicator {
    background-color: #24a924 !important;
    border-color: #24a924 !important;
    color: #fff;
}

.RadStepper_Default.k-stepper .k-step-current.k-step-disabled .k-step-indicator::before {
    content: "";
    width: 10px;
    height: 10px;
    background-color: white;
    border-radius: 50%;
}

.k-step-indicator-text {
    display: none !important;
}

.k-progressbar-vertical.k-progressbar-reverse {
    height: 100% !important;
    position: relative !important;
    margin-top: -455px !important;
}

.k-stepper .k-step-link {
    height: 90px !important;
}

@media(max-width: 650px) {
    #divMain {
        width: 100% !important;
    }

    .stepper-container {
        display: none !important;
    }
}

@media(min-width: 651px) and (max-width:1240px) {
    #divMain {
        width: 55% !important;
    }
}
.pull-left {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
    color: white
}
input[type="checkbox"]:checked {
    accent-color: var(--secondary-color);
}
.directionErr {
    margin-top: 20px;
    direction: ltr
}
.service-state .status-element {
    width: 400px;
    height: fit-content;
    background: #faf9f8;
    border-radius: 8px;
    padding: 20px;
    position: absolute;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 15;
    margin-right: 15px;
}

    .service-state .status-element button {
        background-color: transparent;
        outline: none;
        border: none;
    }

    .service-state .status-element .form-element {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

        .service-state .status-element .form-element label {
            margin-top: 15px;
            text-align: right;
            width: 100%;
            font-family: Tajawal;
            font-size: 14px;
            font-weight: 500;
            text-align: right;
            color: #26283b;
            margin-bottom: 12px;
        }

        .service-state .status-element .form-element input {
            border: 1px solid #e8eef7;
            width: 100%;
            height: 45px;
            border-radius: 8px;
            direction: rtl;
            padding-right: 10px;
            font-size: 15px;
            color: #000;
            outline: none;
        }

        .service-state .status-element .form-element button {
            width: 155px;
            height: 40px;
            background-color: var(--primary-color) !important;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            gap: 10px;
            color: #fff;
            border-radius: 8px;
        }
.custom-pager a {
    display: inline-block;
    padding: 10px 20px;
    color: #000000;
    text-decoration: none;
    border-radius: 8px;
    font-weight: bold;
    margin: 0 5px;
    transition: background-color 0.3s ease;
    border: 2px solid #dbc4ab;
    font-size: 20px;
}

    .custom-pager a:hover {
        background-color: var(--scondary-color);
    }

.custom-pager span > span {
    background-color: #ede1d5;
    border-radius: 8px;
    border: 2px solid #dbc4ab;
    color: black;
}

.arrowClass {
    color: var(--primary-color) !important;
    background-color: white !important;
    border: 1px solid #cecece !important;
    transform: rotate(180deg);
}

.custom-pager span, .custom-pager span > span {
    padding: 10px 20px;
    font-size: 20px;
    font-weight: bold;
    margin: 0 5px;
    cursor: not-allowed;
    display: inline-flex;
}
.item-popup-media {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    background: white;
    padding: 10px 20px 20px 20px;
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
    display: none;
    max-width: 90%;
    max-height: 90vh;
    overflow: auto;
}

.RadMediaPlayer_MetroTouch .rmpToolbar {
    background-color: var(--primary-color) !important;
    color: #ececec !important;
}

.RadMediaPlayer .rmpBigPlayIcon:before {
    font-size: 25px;
    line-height: 1.5;
    padding-left: 5.5px;
}

.RadSlider_MetroTouch .rslTrack a.rslDraghandle {
    background-color: var(--secondary-color) !important;
}

.RadSlider_MetroTouch .rslSelectedregion {
    background-color: #ceb476;
}

.rmpIcon {
    color: white;
}

.sshContent {
    width: 50px
}

.RadSocialShare_MetroTouch {
    background-color: var(--secondary-color);
}

.RadMediaPlayer .rmpTitleBar span {
    margin: auto
}

.RadMediaPlayer .rmpButtSet .rmpActionButton {
    margin: -10px 10px;
}

.RadMediaPlayer .rmpRightControlsSet {
    right: -10px;
    padding: 6px 0;
}

.RadMediaPlayer .rmpActionButton {
}

.RadMediaPlayer_MetroTouch div.rmpVolContrBar {
    background-color: unset;
    border-color: unset;
}

.RadMediaPlayer .rmpVolContrBar {
    border-radius: unset;
    border-width: unset;
    border-style: unset;
}

.RadMediaPlayer {
    overflow: hidden !important;
}

.RadSlider_MetroTouch .rslTrack a.rslDraghandle {
    left: 1px
}
@media (max-width:1024px)
{
    .item-popup-media .item-content, .item-popup-media .item-content .video {
        width: 350px !important;
        height: 350px !important;
    }
}
.item-popup-media .item-content, .item-popup-media .item-content .video {
   
        width: 640px;
    height: 360px;
}
.containerPoll {
    direction: ltr;
}
@media (max-width: 700px) {
    .custom-pager a,
    .custom-pager span {
        padding: 6px 10px !important;
        font-size: 10px !important;
        min-width: 30px !important;
    }

    .custom-pager {
        gap: 5px !important;
        margin: 10px auto !important;
        flex-wrap: wrap !important;
    }
}