﻿@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;
}

.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: rtl;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 26px;
    position: absolute;
    top: 1px;
    left: 1px;
    right: 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: rtl;
    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;
}

.header .search {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
    background-color: #ffffff !important;
    border: 2px solid #e8eef7;
    border-radius: 8px;
}

.slick-track {
    margin-top: 10px;
}

.slick-slide img {
    width: 130px;
    height: 100px;
}

.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: right !important;
    min-height: 150px;
    padding-right: 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  */

.side-social-media {
    position: fixed;
    top: 50%;
    left: -55px;
    width: 100px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transform: translateY(-50%);
    transition: 0.5s;
    z-index: 15;
}
    .side-social-media:hover {
        left: 0;
    }
.side-social-media.initial {
    left: 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: 0 8px 8px 0;
    }

.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;
    left: 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;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 418px;
}
    #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;
    direction: rtl;
}

.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;
    /* Modefied by Yosef on 21-4-2025 */
    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 .row.form-group.eval-row:nth-of-type(2) {
        flex-direction: row !important;
    }
.doneEval
{
    direction:rtl
}
.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: right;
    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: rtl;
    outline: none;
    font-size: 16px;
    padding-left: 10px;
}
    .data-form-content .data-form .inputs .input .select2 {

        width:100% !important;
    }
        .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: right;
    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: right;
    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-left: 15px;
    padding-right: 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-left: 15px;
    direction: rtl;
    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: 8px 0 0 8px;
}

.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: 0 8px 8px 0;
    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: right;
    color: #808080;
}

.inner-page .inner-text h2 {
    font-family: Tajawal;
    font-size: 16px;
    font-weight: 500;
    color: #26283b;
    text-align: right;
    direction: rtl;
    margin-bottom: 40px;
}

.inner-page .inner-text p {
    font-family: Tajawal;
    font-size: 16px;
    font-weight: 500;
    color: #26283b;
    text-align: justify;
    text-align: right;
    direction: rtl;
    margin-bottom: 43px;
}

/* Start Upper Nav Styles */

.upper-nav .upper-nav-content {
    display: flex;
    flex-direction: row;
    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;
                            text-align: right !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: 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: 2000000;
    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;
            /* 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;
                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: #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: 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;
    }

        .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: 34px;
            animation: slideMove 60s 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(-100%);
            /* Change from translateX(35%) */
        }

        100% {
            transform: translateX(0);
            /* Change from translateX(-100%) */
        }
    }

    .moving-slider:hover,
    .moving-slider2:hover {
        animation-play-state: paused;
    }

    /* End Moving News Slider Styles */

    .moving-slider:hover,
    .moving-slider2:hover {
        animation-play-state: paused;
    }

    /* End Moving News Slider Styles */

    /* Start Landing Styles */

    .landing .landing-content .toggle-screen-btns-container {
        width: 100%;
    }

    .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: 600px;
            }

                .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: contain;
                            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;
                    left: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-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 .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;
                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%;
                    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-left: 0;
                        gap: 18px;
                        margin-left: 15px;
                        margin-right: 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;
                    margin: 15px !important;
                }

                    .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: space-around;
                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: 415px;
                }

                    .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 .blog {
                            width: 364px;
                            min-height: 415px;
                            position: relative;
                            margin-left: 40px;
                            margin-right: 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;
                                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;
                                    direction: rtl;
                                }

                                .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;
                    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;
    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.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: 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 {
                    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: 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;
                    }
.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;
}


    /* 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;
            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 .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: 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;
                }

    /* 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: 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;
                direction: ltr;
            }


                .page-header .page-header-content .page-header-info ul li {
                    direction: rtl;
                    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: right;
                        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: right !important;
    }

    .en .select2-container--default .select2-results > .select2-results__options {
        max-height: 200px;
        overflow-y: auto;
        text-align: left !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:rtl;
        }

            .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 {
                        width: 100%;
                        height: 52px;
                        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 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 {
                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 15px;
                direction:ltr
            }

                .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-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: right;
                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;
            /* Modefied by Yosef on 21-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: 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 a {
            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 .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: flex-end;
                    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: rtl;
                        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 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: 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;
    }

        .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, .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: 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;
        }

            .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-right: -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;
                direction: rtl;
            }

        .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: 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: right;
                    width: 100%;
                }

                    .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: rtl;
                    }

                    .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 !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: rtl !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: 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 {
    }
        /* Modefied by Yosef on 29-4-2025 */
        .contact-us-page .police-stations .stations .station .locations-popup .direction img {
            width: 10%;
            height: 10%;
            margin-right: 21px;
        }

        .contact-us-page .contact-options {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
            margin-bottom: 80px;
            direction: rtl;
        }

            .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: 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 {
        }

    .police-stations .toggle-police-stations-categories-btns {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: flex-start !important;
        gap: 20px;
    }

    .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;
    }

    .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: space-between;
        flex-wrap: wrap;
        direction: rtl;
        /* max-height: 550px !important;
            overflow-y: scroll;*/
        margin-bottom: 3%;
    }


        /*.contact-us-page .police-stations .slick-track {
    width:max-content !important;*/
        /*  max-width: max-content;
    padding-right: 50px;
    padding-left: 50px;*/
        /*}*/

        .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;
            }
        .station .update-map {
            cursor: pointer;
        }

    .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;
            font-weight: bold !important;
        }


            .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: 500;
    text-align: right;
    color: #26283b;
}
*/
        /* Modefied by Yosef on 28-4-2025 */
        .contact-us-page .police-stations .stations .station .locations-popup ul {
            direction: ltr;
        }

        .contact-us-page .police-stations .stations .station .locations-popup .all-services i {
            color: #dbc4ab;
        }

        .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: 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;
        }

            .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;
            }

    /* 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;
            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;
        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;
            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;
                direction: rtl;
            }

            .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 21-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: right;
                color: #808080;
                direction: rtl;
            }

        .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: 8px 0 0 8px;
                    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;
                }

                .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: 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: rtl;
            }

            .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: 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: 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: 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: rtl;
                }

        .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 .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;
            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: 45px;
                top: 35px;
                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;
            object-fit: cover;
        }

        .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;
            
        }
            .polls-page .form-element .options button {
                width: 130px !important;
            }

        .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;
            }
@media(max-width:500px) {
    footer .lower-footer-content ul {
        margin-top: 0 !important;
    }

    footer .lower-footer-content .clients-stats {
        display: none !important;
    }
    footer .upper-footer-content ul a
    {

        font-size:10px !important;
    }

    .polls-page .form-element .options {
        justify-content: space-around !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: 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: 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: right;
        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: 8px 0 0 8px;
            outline: none;
            border: none;
        }

        .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: 100%;
            height: 65px;
            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 {
        direction: ltr !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: 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;
        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: 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 */

    .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 21-4-2025 */
        align-items: center;
        padding: 15px;
        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;
        }

            /* Modefied by Yosef on 21-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: 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 */

    /* Default: Hide the div (for mobile devices) */
/*    .side-social-media {
        display: none;
    }*/

    .speeds-table.content-table {
        overflow: hidden !important;
    }

    .faq-groups {
        padding: 2%
    }

    .faq-group {
        padding: 1%
    }

    .faq-groups h3 {
        direction: rtl;
    }

    /* 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;
        }
    }
.short-cuts {
    display: block;
}
    /* Default: Hide the div (for mobile devices) */
/*    .short-cuts {
        display: none;
    }*/

    /* Show the div for devices with a screen width of at least 600px (tablets, small laptops) */
    /*@media (min-width: 600px) {
        .short-cuts {
            display: block;
        }
    }*/

    /* Optional: Additional styles for larger screens (e.g., large laptops, desktops) */
/*    @media (min-width: 1024px) {
        .short-cuts {
            display: block;
        }
    }*/
/*@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;
    }
}
*/
    
    /* Modefied by Yosef on 23-4-2025 */
    .statcounter {
        display: none;
    }

    /*.landing .screens {
        position: relative;
        top: -10px;*/
        /* right: 0px; */
    /*}*/

.side-social-media-formobile {
    display: none !important;
}

    /* Modefied by Yosef on 21-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 */
    }
    .clients {
    min-height: 158px !important;
}
    .news-inner-page .news-text .header {
        flex-direction: column;
    }

        .news-inner-page .news-text .header h3 {
            margin-top: 30px;
        }


    .police-auto-talker {
        z-index: 500000 !important;
        width: 100% !important;
        right: 0 !important;
    }

  
    .overview-page .text p {
        text-align: center !important;
    }

    .services-categories .category .category-services-slider .slick-list {
        height: auto !important;
    }

    .contact-us-page .police-stations .stations {
        flex-direction: column !important;
    }

    .landing .screens .screen .our-services {
        min-height: 583px !important;
    }
    /*
        .landing .screens .screen .new-about-police .images-slider .slide img {
            object-fit: fill !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-reverse !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;
    }

    .side-nav {
        bottom: 0;
    }

    .speeds-page .table {
        overflow-x: auto;
        white-space: nowrap;
        width: 100%;
        direction: rtl;
    }

        .speeds-page .table .custom {
            gap: 90px;
        }

        .speeds-page .table .custom2 {
            width: fit-content;
        }

    /* Modefied by Yosef on 27-4-2025 */
    .landing .screens .screen .our-services .identity-number-search .input {
        width: 315px !important;
    }
    /* Modefied by Yosef on 23-4-2025 */
    .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 {
        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;
        }

        .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;
    }

    .service-apply .service-details-header h1, 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;
    }

    .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;
    }


    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;
    }
    /* Modefied by Yosef on 22-4-2025 */
    .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;
    }

/*    .RadSearchBox .rsbInput {
        border: 1px solid #ffffff !important;
        border-radius: 3px;
    }*/

    .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: 120%;
        margin: auto;
    }

    .news-page .container .row {
        justify-content: center !important;
    }

    .polls-page .poll-results .result span {
        width: 25%;
    }
    /*.side-social-media {
        display: none !important;
    }

        .side-social-media:hover, .side-social-media:active, .side-social-media:focus {
            display: block !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;
            flex-direction: row !important;
            justify-content: space-between;
        }
        /* Modefied by Yosef on 24-4-2025 */
        .copy-right .copy-right-content {
            flex-direction: row !important;
        }

        .services .services-categories .category .category-services-slider .slide {
            margin: auto;
        }
        /* Modefied by Yosef on 27-4-2025 */
        /*.landing .screens .screen .new-about-police .slider-btns {
            right: unset !important;
        }*/
        .landing .screens .screen .new-about-police .images-slider .slide img {
            object-fit: contain !important;
        }
        footer .upper-footer-content ul {
            justify-content: center !important;
        }
        /*.service-apply .apply-service-form .input-auth .input > div {
        flex-wrap: wrap !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:not(:nth-child(1)):not(:nth-child(3)) {
            width: auto !important; /* or 70%, 100%, etc. depending on your layout */
        }

/*        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 {
            width: auto !important;
        }

        .RadSearchBox_Silk .rsbInner {
            display: flex;
            justify-content: flex-end !important;
        }

        .side-nav {
            width: 100% !important;
        }

            .side-nav .side-nav-content {
                align-items: flex-start !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;
        }

    }
/*@media(min-width: 500px) and (max-width: 600px) {
    nav .mobileNavdDrawer .nav-elements .nav-element > button {
        padding: 0 !important;
    }
}*/
@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;
        left: unset !important;
        right: unset !important;
        top: 22px;
    }

    .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: 500px) and (max-width: 1425px) {
    .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) {
    .news-moving-slider .news-moving-content h2 {
        width: 20%;
    }
    .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 {
        right: 6px !important;
        margin-right: 0 !important;
    }

    .inner-short-cut .accessibility {
        width: 350px !important;
        top: unset !important;
        transform: translateY(-40%) !important;
        right: 6px !important;
    }

    .inner-short-cut .happines-element {
        right: 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 {
        right: 0 !important;
        top: 33% !important;
    }

    .short-cuts .content {
        gap: 3px !important;
        margin-right: 5px;
    }

        .short-cuts .content .icon {
            width: 35px;
        }


    .polls-page .form-element {
        margin-right: 15px;
    }
    .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%;
        right: 0;
        flex-direction: column;
        align-items: flex-end;
        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 {
            right: 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: right 0.3s ease-in-out;
            right: -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;
                }

    .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 */
    }
    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 .rsbInput
    {
        width:100% !important;
        height:40px;
    }
    .RadSearchBox .rsbButtonSearch {
        right: unset !important;
        left: 0;
    }
        .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;
                        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;
                    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;
        right: 10px;
        top: 50%;
        transform: translateY(-50%) !important;
        z-index: 60000;
    }

    .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 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;
                }

                .inner-short-cut .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;
                }

                .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;
            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;
        right: 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: 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;
                    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: right;
                        color: #303437;
                    }

                    .police-auto-talker .content .body .messages .receiver .message ul {
                        font-family: Tajawal;
                        font-size: 13px;
                        font-weight: 500;
                        text-align: right;
                        color: #303437;
                        margin-top: 20px;
                        margin-bottom: 20px;
                        display: flex;
                        flex-direction: column;
                        gap: 5px;
                        direction: rtl;
                    }

                        .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: right;
                        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 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;
                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: rtl;
                    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);
    }

    /* 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: 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;
            /* Modefied by Yosef on 23-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;
            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;
        }

        .landing .landing-content .toggle-screen-btns {
            width: fit-content;
            direction: ltr;
            /* Modefied by Yosef on 21-4-2025 */
            margin: auto;
        }

            .landing .landing-content .toggle-screen-btns button {
                width: 150px;
            }

        .landing .landing-content .toggle-screen-btns-container {
            overflow-x: scroll;
            direction: rtl;
        }

        .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: right;
            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: 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: 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 {
            margin: auto;
        }

        .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-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;
        }*/

        .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: 100%;
                min-height: 465px;
                position: relative;
                margin-left: 0;
                margin-right: 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: 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-reverse;
            align-items: center;
            gap: 10px;
            justify-content: flex-start;
            text-align: right;
            flex-wrap: wrap;
            direction: ltr;
        }

            .page-header .page-header-content .page-header-info ul li {
                direction: rtl;
                display: flex;
                flex-direction: row-reverse;
                align-items: center;
                gap: 5px;
            }

        .news-inner-page .news-text {
            /* Modefied by Yosef on 21-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: rtl;
        }

            .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: ltr;
            }

                .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: 0px 8px 8px 0px;
            }

        .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-right: 18px;
            margin-left: 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: rtl;
        }

        .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;
            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: 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: rtl;
        }

        .advice-inner-page .header {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 32px;
            flex-wrap: wrap;
        }

        .services-header .toggle-services-categories-btns-container {
            width: 100%;
            overflow-x: scroll;
            direction: rtl;
        }

        .services-header .toggle-services-categories-btns {
            width: fit-content;
        }

            .services-header .toggle-services-categories-btns button {
                min-width: fit-content;
                font-size: 14px;
                padding-left: 15px;
                padding-right: 15px;
            }

        .overview-page .text ul li {
            width: 100%;
            margin-bottom: 15px;
        }

        .services-header .toggle-screen-btns-container {
            width: 100%;
            overflow-x: scroll;
            direction: rtl;
        }

        .services-header .toggle-services-categories-btns {
            width: fit-content;
            display: flex;
            flex-direction: row;
            flex-wrap: nowrap;
            direction: rtl;
        }

        .side-nav {
            width: calc(100% - 50px);
        }

        .new-page .select2 {
            width: 77px !important;
            height: 44px;
            border-radius: 8px;
            border: 1px solid #e8eef7;
            direction: rtl;
        }

        .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;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            border: 1px solid #00000059;
        }

        /* Modefied by Yosef on 21-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-left: 0;
                margin-right: 0;
            }*/

            .landing .screens .screen .our-services .landing-services .services-slider .slide {
                margin-left: 0;
                margin-right: 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-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: right !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;
        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: right !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;
            z-index: 1;
            background-color: #fff;
            height: 71%;
            /* bottom:;
        width:; */
            right: -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: rtl !important;
}

    .RadSearchBox .rsbInput {
        height: 1.42857143em;
        margin: 3px 0.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: 30px !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.en {
        direction: rtl;
    }

        nav.en .nav-content {
            direction: rtl;
        }

            nav.en .nav-content .nav-elements .nav-element > a {
                text-align: left;
                direction: ltr;
                direction: ltr;
            }

            nav.en .nav-content .nav-elements .nav-element .search-input {
                direction: ltr;
                direction: ltr;
            }

    .side-nav.en.active {
        left: 0;
        direction: ltr;
    }

    .side-nav.en {
        left: -1000px;
        direction: ltr;
    }

        .side-nav.en .side-nav-content > button {
            right: -40px;
            left: inherit;
            border-radius: 0px 6px 6px 0px;
            direction: ltr;
        }

    nav.en .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content h4 {
        text-align: left;
        direction: ltr;
    }

    nav.en .nav-content .nav-elements .nav-element #langs-menu .langs-menu-content select {
        direction: ltr;
        direction: ltr;
    }

    .page-header.en {
        direction: rtl;
    }

    .three-d-open-data.en .header .search {
        direction: rtl;
    }

        .three-d-open-data.en .header .search > label {
            text-align: left;
            direction: ltr;
        }

    .three-d-open-data.en .open-data-stats .stats-header {
        direction: rtl;
    }

    .inputs.en .input {
        direction: rtl;
    }

    nav.en .nav-content .nav-elements {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
        direction: rtl;
    }

    .en i.la-angle-left,
    .en i.la-angle-right {
        transform: rotate(180deg);
    }

    .page-header.en .page-header-content .page-header-info ul {
        direction: ltr;
    }

    .advice-page.en .advice-header .search input,
    .questionnaires-page.en .questionnaires-header .search input {
        direction: ltr;
    }

    .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: left;
    }

    .page-header.en .page-header-content .page-header-info h1 {
        text-align: left;
    }

    .advice-inner-page.en .advice-text {
        direction: ltr;
    }

    .content-table.en table tr {
        direction: rtl;
        text-align: left;
    }

        .content-table.en 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.en .page-header-content .page-header-info ul {
        flex-direction: row;
    }

    .inner-page.en .inner-text h2 {
        direction: ltr;
        text-align: left;
    }

    .inner-page.en .inner-text p {
        direction: ltr;
        text-align: left;
    }

    .en.years {
        position: relative;
        height: 152px;
    }

    .blog-page.en .blog-item .text h1 {
        text-align: left;
    }

    .contact-us-page.en .contact-options .option h3 {
        text-align: left;
    }

    .contact-us-page.en .contact-options .option h2 {
        text-align: left;
    }

    .contact-us-page.en .police-stations .stations .station h2 {
        text-align: left;
    }

    .contact-us-page.en .police-stations h1 {
        text-align: left;
    }

    .contact-us-page.en .contact-us-footer {
        direction: rtl;
    }

    .policy-page.en .policy-page-text {
        direction: ltr;
    }

    .event-inner-page.en .event-text h2 {
        text-align: left;
    }

    .event-inner-page.en .event-text p {
        text-align: left;
    }

    .events-page.en .event-item .text {
        direction: rtl;
    }

    .en i.la-arrow-left,
    .en i.la-arrow-right {
        transform: rotate(180deg);
    }

    .faqs.en .faqs-content .question .head {
        direction: rtl;
    }

        .faqs.en .faqs-content .question .head h1 {
            direction: ltr;
        }

    .faqs.en .faqs-content .question .body p {
        direction: ltr;
        text-align: left;
    }

    .faqs.en .faqs-content .question .body .form-element {
        direction: ltr;
    }

    .faqs.en .faqs-content .question .body label {
        text-align: left;
        width: 100%;
    }

    .faqs.en .faqs-content .question .body textarea {
        text-align: left;
    }

    .en input {
        padding-right: 15px !important;
        text-align: left !important;
        padding-left: 10px !important;
        direction: ltr !important;
    }

    .commander-talk.en .text {
        color: #26283b;
        direction: ltr;
        text-align: left;
    }

        .commander-talk.en .text h2 {
            text-align: left;
        }

        .commander-talk.en .text h1 {
            text-align: left;
        }

    .history-page.en .history .text {
        direction: ltr;
    }

    .news-moving-slider.en .news-moving-content h2 {
        border-right: 2px solid #edf2f8;
        left: 0;
        right: inherit;
        border-left: inherit;
        padding-right: 10px;
        padding-left: 15px;
        width: 9%;
    }

    .landing.en .screens .screen .our-services .landing-services-search .input button {
        right: 30px;
        left: inherit;
    }

    .landing.en .screens .screen .last-news .all-news .news-slider .slide .blog .text p {
        text-align: left;
    }


    .landing.en .screens .screen .support-help .options a .option h1 {
        text-align: left;
    }

    .landing.en .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.en .toggle-services-categories-btns {
        direction: rtl;
    }

    .services.en .services-categories .category .category-services-slider .slide .service h1 {
        text-align: left;
    }

    .services.en .services-categories .category .category-services-slider .slide .service a {
        text-align: left;
    }

    .services.en .services-categories .category .category-services-slider .slide .service {
        width: 214px;
    }

    .laws-and-legistations.en .laws-content .law {
        direction: rtl;
    }

        .laws-and-legistations.en .laws-content .law h1 {
            text-align: left;
        }

    .container.en .row {
        flex-direction: row;
    }

    .media-page.en .media-item .text h1 {
        text-align: left;
    }

    .news-inner-page.en .news-text p {
        text-align: left;
        direction: ltr;
    }

    .news-inner-page.en .news-text h2 {
        direction: ltr;
        text-align: left;
    }

    .news-page.en .news-item .text p {
        text-align: left;
    }

    .en label {
        direction: ltr !important;
    }

    .en textarea {
        padding-right: 15px !important;
        text-align: left !important;
        padding-left: 10px !important;
        direction: ltr !important;
    }

    .en select {
        padding-right: 15px !important;
        text-align: left !important;
        padding-left: 10px !important;
        direction: ltr !important;
    }

    .organization-page.en .organization h2 {
        text-align: left;
    }

    .overview-page.en .text h1 {
        text-align: left;
        width: 100%;
    }

    .overview-page.en .text p {
        text-align: left;
        direction: ltr;
    }

    .polls-page.en .form-element {
        direction: ltr;
    }

    .polls-page.en .polls-content {
        direction: ltr;
    }

    .polls-page.en .poll-results .result h2 {
        text-align: left;
    }

    .publication-sub-page.en .publication-item .text p {
        text-align: left;
    }

    .questionnaires-inner.en .questionnaires-inner-content {
        direction: ltr;
    }

        .questionnaires-inner.en .questionnaires-inner-content .inputs h2 {
            text-align: left;
            direction: ltr;
        }

    .inputs.en .input {
        direction: ltr;
    }

    .input > label {
        /*  text-align: left !important;*/
        width: 90% !important;
    }

    .service-apply.en .apply-service-form .inputs label {
        text-align: left;
    }

    .service-apply.en .apply-service-form .upload-input > label {
        text-align: left;
    }

    .service-apply.en .service-details-header {
        direction: rtl;
        text-align: left;
    }

        .service-apply.en .service-details-header div h1 {
            text-align: left;
        }

        .service-apply.en .service-details-header div h2 {
            text-align: left;
        }

    .service-details.en .service-description {
        text-align: left;
        direction: rtl;
    }

        .service-details.en .service-description p {
            text-align: left;
            direction: ltr;
        }

    .service-details.en .service-steps .step h2 {
        direction: ltr;
        text-align: left;
    }

    .service-details.en .service-steps > h1 {
        text-align: left;
    }

    .service-details.en .service-details .detail {
        direction: rtl;
        text-align: left;
    }

        .service-details.en .service-details .detail div h2 {
            text-align: left;
        }

        .service-details.en .service-details .detail div h1 {
            text-align: left;
        }

        .service-details.en .service-details .detail div ul li {
            direction: ltr;
            text-align: left;
        }

    .content-table.en table tr th {
        text-align: left;
    }

    .content-table.en table tr td h2 {
        text-align: left;
    }

    .support-form.en .support-form-content .data-form .upload-input label {
        text-align: left;
    }

    .usage-analytics-page.en h1 {
        text-align: left;
    }

    .services-header.en .service-header-content {
        flex-direction: row-reverse;
    }

        .services-header.en .service-header-content .options .input button {
            left: inherit;
            right: 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: left;
        }

    .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: left;
    }

    .side-nav.en .side-nav-content .main-menu > li .menu-links-options > a {
        text-align: left;
        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: left;
    }

    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: rtl;
        /* 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%;
        left: 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;
        left: 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;
/*        right: 10px;*/
    }

    /* Styles for the iframe */
    .popup iframe {
        width: 100%;
        height: 100%;
        border: none;
    }

    img[src*="statcounter.com"],
    iframe[src*="statcounter.com"] {
        display: none !important;
    }


    .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;
    }


    /* 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 !important;
            /* 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 */
    }


    .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: rtl;
        flex-direction: row;
        display: flex;
    }

    .custom2 {
        border: 2px solid #e8eef7;
        border-radius: 8px;
        gap: 1%;
        transition: 0.5s;
        margin: 15px;
        padding: 10px;
        direction: rtl;
        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%
    }


    /*Added by Yasmin*/
    /* 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 h3 {
                font-family: Tajawal;
                font-size: 18px;
                font-weight: 600;
                text-align: right;
                color: #26283B;
                /* margin-bottom: 40px;*/
                text-decoration: underline;
                text-underline-position: under;
            }

            .contact-us-page .police-stations .stations {
                display: flex;
                flex-direction: row;
                align-items: center;
                justify-content: center;
                flex-wrap: wrap;
                border-bottom: 1px solid #E9EDF3;
            }


                /*.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 .header h3 {
                            font-family: Tajawal;
                            font-size: 21px;
                            font-weight: bold !important;
                            text-align: right;
                            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 a {
    font-family: Tajawal;
    font-size: 17.99px;
    font-weight: 500;
    text-align: right;*/
                    /* Modefied by Yosef on 28-4-2025 */
                    /* color: #26283B;*/
                    /*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;*/
                    /*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: rtl;
        padding: 1.5%;
        overflow-wrap: break-word;
    }

    .commentModal {
        width: 50%
    }

    .comments {
        /* margin-top: 20px;
    margin-bottom: 20px;*/
    }

        .comments h3 {
            text-align: center;
            text-align: center;
            font-size: 21px;
            font-weight: 500;
        }

    .custom-row {
        flex-direction: row !important;
    }

    /* End contact-us-page Section */
    @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: rtl;
    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:rtl;
}

.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: left;
        flex: 1;
    }
/* حاوية الستبر */
.stepper-container {
    width: auto;
    float: left;
    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;
}
.RadStepper_Default.k-stepper .k-step.k-step-disabled .k-step-indicator
{

}
.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;
    }
}
@media (min-width: 600px) {
/*    body .short-cuts {
        top: 35% !important;
    }*/
    .landing .landing-content .toggle-screen-btns-container {
        overflow-x: auto;
    }
}
@media (min-width: 300px) and (max-width: 1425px) {
    .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-child(1) {
        border-radius: 0 7px 7px 0 !important;
    }

    nav .mobileNavdDrawer .nav-element:nth-child(3) {
        border-radius: 7px 0 0 7px !important;
    }
    .list-group .content-table table,
    .content-table table {
        width: 100% !important
    }
    .content-table a {
        margin-left: 0 !important;
    }
    .headingSearch {
        font-size: larger;
    }
    .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);
    }
}

.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: rtl
}
.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;
}

.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;
    flex-direction: row-reverse;
}
.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:rtl;
}
@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;
    }
}