:root {
    --color-base: #1B8354;
    --colors-brand-400: #54C08A;
    --color-dark: #074D31;
    --color-green2: #166a45;
    --default-font-size: 16px;
    --bs-body-font-size: 1rem;
    --a-hover-color: #ffffffcc;
    --box-border-color: #d3d7dc;
    --green-light: #f3fcf6;
    --background-gray: #F9FAFB;
    --green-bg-border: #51826e;
    --bs-navbar-color: #000000;
    --bs-nav-link-color: #000000;
    --border-gray: #e5e7eb;
    --gray-taq: #f9fafb;
    --gray-taq-border: #d8dade;
    --top-header-icon-color: #161616;
    --text-default: var(--colors-base-black);
    --colors-neutral-800: #1f2a37;
    --text-primary-paragraph: #384250;
    --colors-gray-neutral-600: #4d5761;
    --color-primary: #074D31;
    --color-secondary: #1B8354;
    --color-tertiary: #074D31;
    --color-light: #ECEFFF;
    --color-text: #1B8354;
    --color-text-color-secondary: #556478;
    --color-border-color: #ECEFFF;
    --color-danger: #df7c2e;
    --color-orange: #df7c2e;
    --color-warning: #fcb316;
    --color-success: #00ac65;
    --color-color-badge-blue: #74C0EB;
    --color-color-badge-gray: #808285;
    --color-color-disabled: #CCEBFF;
    --color-button-bg-color: #CEE7FA;
    --color-black: #161616;
    --small-font-size: .85em;
    --page-bg-color: #fff;
    --neutral-text-color: #808080;
    --border-color: #f3f9fe;
    --button-text-color: var(--color-text-color);
    --button-bg-color: #CEE7FA;
    --button-border-color: #CEE7FA;
    --button-hover-bg-color: var(--color-primary);
    --button-hover-border-color: var(--color-primary);
    --button-active-bg-color: var(--color-primary);
    --button-active-border-color: var(--color-primary);
    --event-bg-color: var(--color-primary);
    --event-border-color: var(--color-primary);
    --event-text-color: color(text-color);
    --event-selected-overlay-color: rgba(0, 0, 0, 0.25);
    --more-link-bg-color: #d0d0d0;
    --more-link-text-color: inherit;
}

body {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    font-family: 'IBM Plex Sans Arabic';
}

a,
a:active,
a:focus {
    color: inherit;
    text-decoration: none
}

.toolsTop {
    display: flex !important;
    float: left;
    gap: 16px;
}

.toolsLinkTop {
    width: 32px;
    height: 32px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 5px;
    display: -webkit-inline-box;
    margin-left: 5px;
}

.toolsTop-icon {
    color: #1b8354;
    font-size: 28px;
}

.toolsTop-iconlg {
    color: #161616;
    font-size: 23px;
}

.subnav {
    background-color: #f3f4f6;
    border-bottom: 1px solid #d2d6db;
    transition: transform 0.3s ease;
    transition: transform 0.3s ease-in-out;
    min-height: 40px;
}

.subnav.hidden {
    display: none;
    transform: translateY(-100%);
}

.navbar-toggler {
    border: none;
}

.navbar-toggler-icon {
    background-image: none;
    font-size: 1.5rem;
}

.header {
    width: 100%;
    background-color: #ffffff;
    z-index: 1000;
    height: 72px;
}

.header .navbar-nav {
    width: 100%;
}

.nav.navbar .navbar-nav .nav-item {
    background-color: #1b8354;
    color: #fff;
}

.navbar {
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    transition: top 0.3s ease-in-out;
    padding-top: 0px;
    border-bottom: 1px solid #e9ecef;
    background: #ffffff;
    padding-bottom: 0px;
}

.navbar-nav .nav-link.active {
    background: var(--color-base);
    color: #ffffff;
    border-radius: 4px;
    padding-left: 16px;
    padding-right: 16px;
}

.signature .accordion h6 {
    font-size: clamp(14px, 1.5vw, 14px);
    font-weight: 600;
}

.signature .accordion span h6 {
    font-size: 18px;
}

.navbar .navbar-nav .nav-item .nav-link:hover {
    background: #f3f4f6;
    color: #162c2a;
    border-radius: 5px;
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: #1B8354 !important;
    color: #162c2a;

}

.dropdown-item:focus {
    background: #E5E7EB;
    border: 1px solid #ffffff;
    outline: 2px solid #161616 !important;
    color: #162c2a;
}

.navbar .navbar-nav .nav-item .link-bg.active::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 10%;
    width: 80%;
    height: 6px;
    background: transparent;
    border-radius: 50px;
    background: var(--colors-brand-400);
}

.navbar .navbar-nav .nav-item .link-bg:hover::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 10%;
    width: 80%;
    height: 6px;
    background: transparent;
    border-radius: 50px;
    background: #9da4ae;
}

.navbar ul li a {
    font-weight: 500;
    line-height: 3.7;
    font-size: 16px !important;
    position: sticky;
    color: #161616;
    padding-top: 6.5px;
    padding-bottom: 6.3px;
}

.profile ul li a {
    line-height: normal;

}

.nav-link-left {
    margin-right: 18px;
    display: block;
    padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
    font-size: var(--bs-nav-link-font-size);
    font-weight: var(--bs-nav-link-font-weight);
    color: var(--bs-nav-link-color);
    text-decoration: none;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}

.navbar-nav .nav-item {
    margin-left: 5px;
}

.navbar-nav .dropdown-menu {
    margin-bottom: 47px;
}
.navbar .navbar-nav .nav-item .nav-link.active:hover {
    background: #166A45 ;
    color: #ffffff;
    border-radius: 4px;
    padding-left: 16px;
    padding-right: 16px;
}

.navbar .navbar-nav .nav-item .nav-link.active:focus {
    background: #14573A ;
    color: #ffffff;
    border-radius: 4px;
    padding-left: 16px;
    padding-right: 16px;
box-shadow: inset 0 0 0 2px #ffffff;
}


.navbar .navbar-nav .nav-item .nav-link.active:active  {
    background: #104631  ;
    color: #ffffff;
    border-radius: 4px;
    padding-left: 16px;
    padding-right: 16px;
}

 
 
.navbar .navbar-nav .nav-item .link-bg.active:hover::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 10%;
    width: 80%;
    height: 6px;
    background: transparent;
    border-radius: 50px;
    background: var(--colors-brand-400);


}


.navbar-nav .dropdown-menu .dropdown-item {
    line-height: 2 !important;
    border-radius: 8px;
}

.navbar-nav .dropdown-menu .dropdown-item:hover {
    background: #f3f4f6 !important;
    text-decoration: underline;
}

.navbar-nav .dropdown-menu .nav-item.active {
    background: #f3f4f6 !important;
    border-radius: 8px;
}

.navbar-nav .dropdown-menu .dropdown-item:active {
    background: #E5E7EB !important;
    text-decoration: underline;
}

.navbar-nav .dropdown-menu .dropdown-item:focus {
    outline: #0D121C solid 2px !important;
    text-decoration: underline;
}


.mhafzat {
    width: 442px;
}

.mhafzat li {
    display: inline-grid;
    width: 144px;
}

.signature .accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    text-align: right;
    background-color: #ffffff00;
    border: 0;
    border-radius: 0;
    overflow-anchor: none;
    transition: var(--bs-accordion-transition);
    width: fit-content !important;
    color: #1B8354;
    font-size: 14px;
    font-weight: normal;
    padding: 0px;
}

.signature .accordion-button:hover,
.signature .accordion-button:visited:hover,
.signature .accordion-button:hover,
.signature .accordion-button:visited:hover {
    color: #54c08a !important
}


.signature .accordion-button:focus,
.signature .accordion-button:focus * {
    color: #1B8354 !important;
    outline: #0D121C solid 2px !important;
}

.signature .accordion-button::after {
    background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%231B8354"/></svg>') !important;

}

.signature .accordion-button:hover::after {
    background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%2354C08A"/></svg>') !important;

}

.signature .accordion-button:active {
    color: #88D8AD !important;
}

.signature .accordion-button:active::after {
    background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%2388D8AD"/></svg>') !important;
}



.accordion-button:focus::after {
    background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%231B8354"/></svg>') !important;
}



.signature .accordion-button:not(.collapsed) {
    background-color: transparent;
    color: #1B8354;
    font-size: 14px;
    font-weight: normal;
}

.signature .accordion {
    --bs-accordion-border-color: transparent;
}

@media (max-width: 576px) {
    .service {
        width: 100%;
    }

}

footer {
    background: var(--color-dark);
    color: #ffffff;
    min-height: 361px;
}

.footer-title {
    font-size: var(--default-font-size);
}

footer ul li {
    list-style-type: none;
    font-size: 16px;
    font-weight: 300;
}

.bd-footer a:hover,
.bd-footer a:focus {
    color: var(--a-hover-color);
    text-decoration: underline;
}

.socialMedia {
    display: flex !important;
}

.socialMediaLink {
    width: 38px;
    height: 38px;
    border: 1px solid;
    border-color: var(--green-bg-border);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 5px;
    display: -webkit-inline-box;
    margin-left: 5px;
}

.socialMediaLink:hover {
    background: rgb(255 255 255 / 30%);
}

.socialMediaLink:focus {
    border: 2px solid #ffffff;
    background-color: transparent;
    width: 38px !important;
    height: 38px !important;
}

footer ul li a {
    font-size: 14px;
}

.footer-icons {
    color: #ffffff;
    font-size: 20px;
}

.dropdown-toggle::after {
    display: inline-block;
    margin-right: .255em;
    vertical-align: -0.45em;
    border-top: none;
    border-left: .3em solid transparent;
    border-bottom: 0;
    border-right: .3em solid transparent;
    content: "";
    width: 20px;
    height: 20px;
    background: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%23161616"/></svg> ');
    fill: #0D121C;
}

.navbar .navbar-nav .nav-item .dropdown-toggle.active::after {
    display: inline-block;
    margin-right: .255em;
    vertical-align: -0.45em;
    border-top: none;
    border-left: .3em solid transparent;
    border-bottom: 0;
    border-right: .3em solid transparent;
    content: "";
    width: 20px;
    height: 20px;
    background: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%23ffffff"/></svg> ');
    fill: #0D121C;

}

.navbar .navbar-nav .nav-item .dropdown-toggle.active.show::after {
    display: inline-block;
    margin-right: -.255em;
    vertical-align: -0.45em;
    border-top: none;
    border-left: .3em solid transparent;
    border-bottom: 0;
    border-right: .3em solid transparent;
    content: "";
    width: 20px;
    height: 20px;
    background: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%23ffffff"/></svg> ');
    transform: rotate(180deg);
}

.navbar .navbar-nav .nav-item .dropdown-toggle.show::after {
    display: inline-block;
    margin-right: -.255em;
    vertical-align: -0.45em;
    border-top: none;
    border-left: .3em solid transparent;
    border-bottom: 0;
    border-right: .3em solid transparent;
    content: "";
    width: 20px;
    height: 20px;
    background: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%23161616"/></svg> ');
    fill: #0D121C;
    transform: rotate(180deg);
}

.navbar .navbar-nav .nav-item .dropdown-toggle.active:hover::after {
    background: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%23161616"/></svg> ');
    fill: #0D121C;
}

.sectionTitle {
    font-size: 30px;
    font-weight: bold;
}

.card {
    position: relative;
    border-radius: 16px;
    background-color: #fff;
    border: 1px solid #D2D6DB;
    padding-bottom: 10px;
    height: 100%;
}

.card-icon {
    background: var(--green-light);
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #f3fcf6;
    width: 50px;
    height: 50px;
    margin-bottom: 25px;
}

.card-icon2 {
    background: #079455;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 50%;
     width: 50px;
    height: 50px;
    margin-bottom: 25px;
 }

.card-icon3 {
    background: var(--green-light);
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #f3fcf6;
    width: 50px;
    height: 50px;
    margin-bottom: 25px;
}


.card .card-title ,  .lightBox .card-title {
    font-weight: 600;
    font-size: 18px;
    line-height: 28px;
}

.text-title {
    font-size: 1.25rem;
}

.card .secandText {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    line-height: 28px;
    overflow: hidden;
    word-wrap: break-word;
    text-overflow: ellipsis;
    font-size: 1rem;
    visibility: visible;
}

.card .description {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    line-height: 28px;
    overflow: hidden;
    word-wrap: break-word;
    text-overflow: ellipsis;
    font-size: 1rem;
    visibility: visible;
    min-height: 79px;
}

.section {
    min-height: 443px;
    padding-top: 84px;
    padding-bottom: 113px;
}

.whiteColor {
    color: white !important;
}


.green-text {
    color: #1B8354;
}

.card-icon-square {
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 22%;
    background-color: #f9fafb;
    width: 40px;
    height: 40px;
    margin-bottom: 25px;
}

.icon-gray {
    color: #1b8354;
    font-size: 28px;
}

.card-icon-square-green {
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 22%;
    background-color: #f7fdf9;
    width: 60px;
    height: 60px;
    margin-bottom: 25px;
}

.btn {
    border-radius: 4px;
    height: 40px;
    font-weight: 500;
    font-size: 16px;
}

.btn-secondary {
    --bs-btn-color: #151616;
    --bs-btn-bg: transparent;
    --bs-btn-border-color: #D2D6DB;
    --bs-btn-hover-color: #161616;
    --bs-btn-hover-bg: #F3F4F6;
    --bs-btn-hover-border-color: #E5E7EB;
    --bs-btn-focus-shadow-rgb: none;
    --bs-btn-active-color: #161616;
    --bs-btn-active-bg: #E5E7EB;
    --bs-btn-active-border-color: #D2D6DB;
    --bs-btn-active-shadow: none;
    --bs-btn-disabled-color: #9DA4AE;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #E5E7EB;
}

.btn-check:checked+.btn-secondary {
    background-color: #E5E7EB;
    border-color: #D2D6DB;
    color: #161616;
}

.btn-secondary:focus {
    border: 1px solid #ffffff;
    outline: 2px solid #161616 !important;
    color: #161616 !important;
}

.btn-filter,
.btn-filter-applay {
    background-color: #0c111b !important;
    border-color: #0c111b !important;
    color: #ffffff !important;
}

.btn-filter:hover,
.btn-filter-applay:hover {
    background-color: #1F2A37 !important;
    border-color: #0c111b !important;
    color: #ffffff !important;
}

.btn-filter:active,
.btn-filter-applay:active {
    background-color: #4D5761 !important;
    border-color: #0c111b !important;
    color: #ffffff !important;
}

.btn-filter:focus .btn-filter-applay:focus {
    background-color: #384250 !important;
    border-color: #0c111b !important;
    color: #ffffff !important;
}

.btn-filter:disabled {
    background-color: #9DA4AE !important;
    color: #9DA4AE !important;
}

.btn-filter::after {
    display: inline-block;
    margin-right: .255em;
    vertical-align: -0.45em;
    border-top: none;
    border-left: .3em solid transparent;
    border-bottom: 0;
    border-right: .3em solid transparent;
    content: "";
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%23ffffff"/></svg> ')
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--color-base);
    --bs-btn-border-color: var(--color-base);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #166A45;
    --bs-btn-hover-border-color: #166A45;
    --bs-btn-focus-shadow-rgb: none;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #104631;
    --bs-btn-active-border-color: #104631;
    --bs-btn-active-shadow: none;
    --bs-btn-disabled-color: #9DA4AE;
    --bs-btn-disabled-bg: #E5E7EB;
    --bs-btn-disabled-border-color: #E5E7EB;
}

.btn-check:checked+.btn-primary {
    background-color: #14573A;
    border-color: #14573A;
    color: #fff;
}

.btn-primary:focus {
    background: var(--color-base);
    border: 1px solid #ffffff;
    outline: 2px solid #161616 !important;
    color: #ffffff !important;
}

.btn-primary:focus::before {

    top: 4px;
    left: 4px;
    right: 4px;
    bottom: 4px;
    border: 3px solid white;
    border-radius: 0.35rem;
    z-index: 1;
    pointer-events: none;
}

.btn-next {
    background: var(--color-base);
    border-color: var(--color-base);
    font-weight: 500;
    font-size: 16px;
    height: 40px;
}

.btn-next:hover {
    background: var(--color-green2);
    border-color: var(--color-dark);
    --bs-btn-active-bg: var(--color-dark);
    --bs-btn-active-border-color: var(--color-dark);

}

.btn-next:focus {
    background: var(--color-base);
    outline: 2px solid #161616 !important;
}

.login-btn {
    padding: 7px;
    border-radius: 5px;
    background: var(--color-base);
    border-color: var(--color-base);
    color: #ffffff !important;
    display: inline;
}

.login-btn:hover {
    background: var(--color-dark);
    border-color: var(--color-dark);
    --bs-btn-active-bg: var(--color-dark);
    --bs-btn-active-border-color: var(--color-dark);
}

.btn-danger {
    margin-bottom: 10px;
}

.btn.disabled,
.btn:disabled,
fieldset:disabled .btn {
    color: #a6acb6;
    pointer-events: none;
    background-color: #e5e7eb;
    border-color: #e5e7eb;
}

.btn-danger {
    border: #d92d20;
    background: #d92d20;
}

.btn-link {
    color: #161b26;
}

.btn-link:hover {
    color: #161b26;
    background: #f3f4f6;
}

.btn-link:active {
    background-color: #e5e7eb !important;
    color: #161b26 !important;
}


.link-primary {
    color: #1B8354 !important;
}

.link-primary:hover {
    color: #54C08A !important;
    text-decoration: underline;
}

.link-primary:focus {
    color: #1B8354 !important;
    outline: #161616 solid 2px !important;
}

.link-primary:active {
    color: #88D8AD !important;
}

.lightBg {
    background: var(--green-light);
}

.background-gray {
    background: var(--background-gray);
}

.tag-gray {
    background-color: var(--gray-taq);
    height: 24px;
    width: fit-content;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding-left: 8px;
    padding-right: 8px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 4px;
    position: relative;
    margin-bottom: 20px;
    font-size: 12px;
}

.tag-green {
    background-color: #ecfdf3;
    height: 24px;
    color: #085D3A;
    width: fit-content;
    border: 1px solid #abefc6;
    border-radius: 4px;
    padding-left: 8px;
    padding-right: 8px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 4px;
    position: relative;
    margin-bottom: 20px;
    font-size: 12px;
}

.tag-blue {
    background-color: #f3f9ff;
    height: 24px;
    color: #1849A9;
    width: fit-content;
    border: 1px solid #B2DDFF;
    border-radius: 4px;
    padding-left: 8px;
    padding-right: 8px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 4px;
    position: relative;
    margin-bottom: 20px;
    font-size: 12px;
}

.sitecolor {

    filter: grayscale(100%) !important;
    display: flow-root;
}

.min-slider {
    height: 490px;
    width: auto;
    background-color: #ffffff;
    background-image: url(../img/twasul/slider.jpg);
    color: #ffffff;
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
}

.min-sliderMakkah {
    height: 607px;
    width: auto;
    background: #ffffff;
    color: #e8f8ee;
}

.sliderTile {
    font-size: clamp(32px, 8vw, 60px);
    color: #161616;
}

.sliderDescription {
    color: #161616;
    font-size: clamp(16px, 4vw, 20px);
    line-height: 30px;
}

.sliderTile2 {
    font-size: clamp(32px, 8vw, 60px);
    color: #ffffff;
}

.sliderDescription2 {
    color: #ffffff;
    font-size: clamp(16px, 4vw, 20px);
    line-height: 30px;
}

.sliderTopBox {
    padding-top: 35px;
    height: 462px;
}

.sliderTopBoxMakkah {
    padding-top: 70px;
    height: 462px;
    position: relative;
}

.bannerButton {
    text-align: center;
    border-radius: 10px;
    padding: 16px;
    background: #ffffff;
    margin-bottom: 12px;
    border: #757575;
    color: #161616;
    font-weight: bold;
    flex: 1 1 0;
    max-width: 200px;
    min-width: 150px;
}

.font-size25 {
    font-size: 25px !important;
}

.font-size20 {
    font-size: 20px !important;
}

.service-icon {
    color: var(--color-base);
    font-size: 25px;
}

.service-menu-icon {
    color: var(--color-base);
    font-size: 16px;
    margin-left: 6px;
}

.serviceMenubg {
    background: #ffffff;
    padding: 9px;
    border: 1px solid #CBD5E1;
    border-radius: 8px;
    z-index: 1;
}

.serviceMenubgTop {
    background: #ffffff !important;
    padding: 9px !important;
    border: 0px !important;
    min-height: 100px !important;
    border-radius: 0px !important;
}

.serviceMenubgTop .nav {
    border-bottom: 2px solid #d2d6db;
}

.serviceMenu {
    background: #ffffff;
    min-height: 516px;
    width: 100%;
}

.serviceMenu .nav-link {
    text-align: justify;
    font-size: 16px;
    color: #000000 !important;
    border-bottom: 1px solid var(--border-gray);
    border-radius: 0 !important;
}

.serviceSearch {
    margin-bottom: 16px;
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background-color: #ffffff;
    font-weight: 600;
    color: #328a5e !important;
}

.pageSection {
    min-height: 443px;
    padding-top: 142px;
    padding-bottom: 113px;
}



.pageTitle {
    font-size: clamp(18px, 5vw, 30px);
    font-weight: 700;
    line-height: 38px;
    color: var(--text-default, #161616);
}

.pageBg {
    background-color: var(--green-light);
    min-height: 245px;
    padding-top: 39px;
}

.pageServiceFormBg {
    background-color: #ffffff;
    position: relative;
    height: 250px;
    margin-bottom: -243px;
    z-index: -1;
}

.rating-title {
    font-size: 16px;
    color: #161616;
    font-weight: 500;
}

.ratingSection {
    border-top: 1px solid #1b8354;
    padding: 6px;
    margin-top: 49px;
}

.ratingSection form {
    margin-bottom: 0px;
}

.ratingTextarea {
    height: 96px !important;
}

.rating {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
}

.rating:not(:checked)>input {
    position: absolute;
    appearance: none;
}

.rating:not(:checked)>label {
    cursor: pointer;
    font-size: 34px;
    color: #E5E7EB;
    margin-left: 8px !important;
}

.rating:not(:checked)>label:before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M22.1839 3.93733C22.8987 2.38758 25.1013 2.38759 25.8161 3.93733L30.3024 13.6635C30.5937 14.2952 31.1923 14.73 31.883 14.8119L42.5195 16.0731C44.2143 16.274 44.8949 18.3688 43.6419 19.5275L35.7781 26.7998C35.2674 27.272 35.0388 27.9757 35.1744 28.6579L37.2618 39.1636C37.5944 40.8375 35.8125 42.1321 34.3233 41.2985L24.9769 36.0668C24.3699 35.7271 23.6301 35.7271 23.0231 36.0668L13.6767 41.2985C12.1875 42.1321 10.4056 40.8375 10.7382 39.1636L12.8256 28.6579C12.9612 27.9757 12.7326 27.272 12.2219 26.7998L4.35805 19.5275C3.10505 18.3688 3.78569 16.274 5.48048 16.0731L16.117 14.8119C16.8077 14.73 17.4063 14.2952 17.6976 13.6635L22.1839 3.93733Z' fill='%23cccccc'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

.rating>input:checked~label:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M22.1839 3.93733C22.8987 2.38758 25.1013 2.38759 25.8161 3.93733L30.3024 13.6635C30.5937 14.2952 31.1923 14.73 31.883 14.8119L42.5195 16.0731C44.2143 16.274 44.8949 18.3688 43.6419 19.5275L35.7781 26.7998C35.2674 27.272 35.0388 27.9757 35.1744 28.6579L37.2618 39.1636C37.5944 40.8375 35.8125 42.1321 34.3233 41.2985L24.9769 36.0668C24.3699 35.7271 23.6301 35.7271 23.0231 36.0668L13.6767 41.2985C12.1875 42.1321 10.4056 40.8375 10.7382 39.1636L12.8256 28.6579C12.9612 27.9757 12.7326 27.272 12.2219 26.7998L4.35805 19.5275C3.10505 18.3688 3.78569 16.274 5.48048 16.0731L16.117 14.8119C16.8077 14.73 17.4063 14.2952 17.6976 13.6635L22.1839 3.93733Z' fill='%231b8354'/%3E%3C/svg%3E");
}

.rating>input:checked+label:hover,
.rating>input:checked+label:hover~label,
.rating>input:checked~label:hover,
.rating>input:checked~label:hover~label,
.rating>label:hover~input:checked~label {
    color: #1b8354;
}

.rating:not(:checked)>label:hover,
.rating:not(:checked)>label:hover~label {
    color: #1b8354;
}

.rating>input:checked~label {
    color: #1b8354;
}

.pageSection {
    min-height: 443px;
    padding-top: 142px;
    padding-bottom: 113px;
}

.pageContent {
    min-height: 443px;
    padding-bottom: 113px;
}

.list-group-item {
    line-height: 40px;
    --tw-space-y-reverse: 0;
    margin-top: calc(16px* calc(1 - var(--tw-space-y-reverse)));
    color: #1f2a37;
}

.list-group-item {
    line-height: 40px;
}

.detailecard {
    min-height: 400px;
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #D2D6DB;
    padding: 40px;
    margin-top: -198px;
}

.detaileTitle {
    font-weight: 700;
    margin-bottom: 6px;
    line-height: 24px;
    color: var(--colors-neutral-800)
}

.serviceInfo {
    margin-top: 73px;
}

.serviceInfo .nav-link {
    color: var(--text-primary-paragraph);
}

.detaileBoxIcon {
    font-size: 22px;
    color: var(--color-base);
}

.detaileBox {
    margin-bottom: 16px;
}

.detaileBoxIcons {
    font-size: 23px;
    color: var(--color-base);
}

.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
    border-color: none;
    background: #F3F4F6;
    border-bottom: 3px solid #161616;
    margin-bottom: -3px;
    padding-bottom: 8px;
}

.nav-tabs {
    border-bottom: 3px solid #D2D6DB !important;
}

.detaileContent {
    padding-right: 27px;
}

.serviceInfo .nav-tabs .nav-link.active {
    font-weight: 500;
    background: none;
    border: none;
    border-bottom: 3px solid #1b8354;
    margin-bottom: -3px;
    padding-bottom: 9px;
}

.serviceMenubg .nav-pills .nav-link {
    color: #161616;
    padding-bottom: 2px;
    padding-top: 2px;
    width: 100%;
    text-align: right;
    padding-right: 9px;
}

.serviceMenubg .nav-pills .nav-link:hover {
    background: #F3F4F6;
}

.serviceMenubg .nav-pills .nav-link.active {
    color: #1B8354 !important;
    background: #F3FCF6;
}

.nav-link:focus {
    outline: #0D121C solid 2px !important;
    border-radius: 5px;
}

.nav-link:active {
    color: #007f20;
    background-color: #E5E7EB;
}

.nav-link .service-icon {
    font-weight: 500;
    font-size: 24px !important;
    color: #161616;
}

.serviceMenubg .nav-pills .nav-link.active .service-icon {
    color: #1B8354 !important;
}

.serviceMenubg .nav-pills .nav-link:focus {
    border-radius: 4px;
}

.serviceMenubg .nav-pills .nav-item {
    color: var(--colors-gray-neutral-600);
    width: 100%;
}

.step-container {
    position: relative;
    margin-left: 20px;
    margin-top: -130px;
}

.step-line {
    position: absolute;
    right: 30px;
    top: 30px;
    height: 79%;
    width: 2px;
    background-color: #e0e0e0;
    z-index: 1;
}

.step {
    align-items: center;
    margin-bottom: 134px;
    z-index: 2;
    position: relative;
}

.step-circle {
    background-color: #fff;
    border: 2px solid #e5e7eb;
    border-radius: 50%;
    font-size: 14px;
    color: #e5e7eb;
    margin-right: 15px;
    z-index: 2;
    float: right;
    display: grid;
    place-items: center;
    height: 32px;
    width: 32px;
    margin-left: 8px;
}

.step:last-child .step-line {
    display: none;
}

.stepDescription {
    margin-right: 48px;
    font-size: 14px;
}

.step-active {
    border: 2px solid var(--color-base);
    color: var(--color-base);
}

.userName {
    float: right;
    margin-left: 18px;
    padding-top: 18px;
}

.note {
    color: #b42318;
    margin-bottom: 24px;
}

.breadcrumbForm {
    padding-top: 24px;
}

.breadcrumb-item.active a {
    color: #9DA4AE !important;
        display: inline-block;
    max-width: 413px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.form-control {
    height: 40px;
    font-size: 16px;
    border: 1px solid #9da4ae;
    border-radius: 4px;
    margin-bottom: 1.5rem !important;
}

input[type="file"] {
    margin-bottom: 6px !important;
}

hr {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb;
    height: 0;
    color: inherit;
    border-top-width: 1px;
}

.form-control:hover {
    border: 1px solid #384250;
}

.form-control:focus {
    color: var(--bs-body-color) !important;
    background-color: var(--bs-form-control-bg) !important;
    border-color: #384250 !important;
    outline: 0 !important;
    box-shadow: none !important;
    border: 1px solid #384250 !important;
}

label {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 8px;
}

form {
    margin-bottom: 56px;
}

.modal-header {
    border-bottom: none;
}

.modal-footer {
    border-top: none;
    padding-top: 0px;
}

.hideAll {
    display: none;
}

.showBox {
    display: block !important;
}

.group {
    line-height: 38px;
}

.erroreTitle {
    font-size: 24px;
    font-weight: 600;
    margin-top: 52px;
    margin-bottom: 12px;
}

.erroreMessege {
    font-size: 18px;
    font-weight: 400;
    margin-top: 52px;
}

.pagestart {
    margin-top: 219px;
}

.line-h-30 {
    line-height: 30px;
}

.breadcrumb-item a:visited {
    color: #14573A;
}

.breadcrumb-item a {
    font-size: 14px;
    color: #384250;
}

.breadcrumb-item a:hover {
    color: #6C737F;
    text-decoration: underline;
}

.breadcrumb-item a:focus {
    color: #384250;
    outline: 2px solid #161616;
}

.breadcrumb-item a:active {
    color: #9DA4AE;

}

.breadcrumb-item+.breadcrumb-item::before {
    font-family: "hgi-stroke-rounded" !important;
    font-style: inherit;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    content: "㭪";
    margin-right: -5px;
    font-size: 16px;
    font-weight: 500;
    margin-left: -6px;
    color: #9DA4AE;
}

[dir="ltr"] .slick-list {
    direction: rtl;

}

[dir="ltr"] .breadcrumb-item+.breadcrumb-item::before {
    transform: scaleX(-1);
    margin-right: 2px;
    margin-left: -13px;
}


[dir="ltr"] .enicon {
    transform: scaleX(-1);

}

.circle-icon {
    background: var(--green-light);
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #f3f4f6;
    width: 40px;
    height: 40px;
}

.circle-icon-color {
    color: #6c737f;
    font-size: 23px;
}

.v3dp__popout {
    width: 27.5em !important
}

.v3dp__popout button span {
    margin-bottom: 17px !important;
    width: 45px !important;
    height: 45px !important;
    font-size: 15px;
    padding-top: 6px;
}

.v3dp__elements .selected span {
    border-radius: 100% !important;
    background-color: #1b8354 !important;
}

.v3dp__elements button:not(:disabled):hover span {
    border-radius: 100% !important;
    border: 1px solid #1b8354 !important;
    background-color: #ffffff !important;
    color: #1b8354 !important;
}

video {
    border: none;
    outline: none;
    display: block;
}

.slick-dots li button:before {
    font-size: 22px !important;
    color: #E5E7EB !important;
}

.slick-dots li.slick-active button:before {
    color: #1b8354 !important;
}

.slick-dots {
    bottom: -51px !important;
    text-align: end !important;
}

.slick-next,
.slick-prev {
    position: absolute;
    top: 107% !important;
    background: #dddddd !important;
}

[dir=rtl] .slick-next {
    right: auto;
    left: auto;
}

#myVideo {
    filter: brightness(0.5);
}

.whiteCard {
    background: #ffffff;
    border-radius: 16px;
    padding: 39px;
    margin-bottom: 76px;
    border: 1px solid #d2d6db;
}

.ads .slick-dotted.slick-slider {
    margin-bottom: 0px !important;
}

.greenBox {
    padding: 11px;
    min-height: 136px;
    margin-bottom: 13px;
    background: #f3fcf6;
    border-radius: 18px;
}

.gray-bg {
    background: #F9FAFB;
}

.slick-ads .slick-dots {
    top: 0;
    margin-top: -94px;
}

.slick-ads img {
    border-radius: 27px;
}

.lightBox {
    background: #F9FAFB;
    padding: 18px;
    border-radius: 8px;
    margin-bottom: 14px;
}

.aboutBox {
    text-align: center;
    border-radius: 16px;
    padding: 32px;
    background: var(--green-light);
}

.aboutDescription {
    font-size: clamp(24px, 10vw, 43px);
    color: #14573A;
}

.aboutTitle {
    color: #212552;
    font-size: 16px;

}

.aboutSection {
    min-height: 400px;
    padding-top: 84px;
    padding-bottom: 118px;
}

.bannerContent {
    position: relative;
    padding-top: 288px;
}

.cookie {
    box-shadow: 0 4px 64px -2px rgba(16, 24, 40, .1), 0 2px 4px -2px rgba(16, 24, 40, .06);
    width: 100%;
    min-height: 90px;
    bottom: 0;
    left: 0;
    z-index: 99;
    display: block;
    position: fixed;
    background: #f3fcf6;
    padding: 15px;
}

.cookie2 {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    min-height: 90px;
    z-index: 99;
    background: #f3fcf6;
    padding: 15px;
    box-shadow: 0 4px 64px -2px rgba(16, 24, 40, .1), 0 2px 4px -2px rgba(16, 24, 40, .06);
    transform: translateY(100%);
    opacity: 0;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.cookie2.show {
    transform: translateY(0);
    opacity: 1;
}

.whiteBox {
    border: 1px solid #e5e7eb;
    padding: 30px;
    border-radius: 1rem;
    background: #ffffff;
    margin-bottom: 27px;
    min-height: 227px;
    text-align: justify;
}

.whiteBox img {
    border-radius: 14px;
}

.whiteBox h4 {
    font-size: 18px;
    font-weight: bold;
    color: #212529;
}

.contantTitle {
    font-size: 30px;
}

.strategy_hight {
    min-height: 292px !important;
}

.breaks {
    border-bottom: 1px solid #D2D6DB;
    margin-bottom: 18px;
}

.accordion-item {
    border-left: 0px;
    border-right: 0px;
}

.accordion-button:not(.collapsed) {
    background-color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    color: #161616;
}

.accordion-button {
    font-weight: bold;
}

.accordion-button:hover {
    background: #F3F4F6;
}

.accordion-button:active {
    background: #E5E7EB;
}

.accordion-button:focus {
    border-color: #161616;
    box-shadow: 0 0 0 0.13rem rgb(0 0 0);
}


.signature .accordion-button:active {
    background: transparent;
}

.accordion-item:first-of-type,
.accordion-item:first-of-type .accordion-button {
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
}

.accordion-item:last-of-type,
.accordion-item:last-of-type .accordion-button {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.page-content {
    text-align: justify;
}

.byanat-input input,
.byanat-input textarea {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.byanat-input textarea {
    height: 120px;
}

.mobileimg {
    height: 500px;
    width: 100%;
}

.slick-slide {
    margin: 0 15px !important;
}

.slick-slide {
    display: flex !important;
    justify-content: center;
    align-items: center;
}

.slick-slide img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
}

.searchbt {
    cursor: pointer;
}

.input-container {
    position: relative;
}

.input-container .bi {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #888;
}

.input-container input {
    padding-left: 35px;
}

.clickable {
    cursor: pointer;
}

.form-control::placeholder {
    color: #6c737f;
}

.form-check-input:checked {
    background-color: #1b8354;
    border-color: #1b8354;
}

.form-check-input {
    border: 1px solid #6c727e;
}

.form-check-input[type=checkbox] {
    border-radius: 2px;
}

.feedback-label {
    color: #1f2a37;
    font-weight: 500;
}

.form-select:disabled,
.form-control:disabled,
input:disabled {
    border: 1px solid #9DA4AE;
    background: #F3F4F6 !important;
}

.marriage-card {
    border: 1px solid #dddddd;
    padding: 12px;
    border-radius: 5px;
    margin-bottom: 29px;
}

.cookie a {
    text-decoration: underline;
}

.form-control,
input[type=text].form-control {
    border-radius: 4px;
    padding: 7px 16px 11px;
    font-size: 1rem;
    border-color: #9da4ae;
    color: #384250 !important;
    background: -webkit-gradient(linear, left top, left bottom, from(#0D121C), to(#0D121C)), -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff));
    background: linear-gradient(#0D121C, #0D121C), linear-gradient(#fff, #fff);
    background-size: 0 2px, auto;
    background-repeat: no-repeat;
    background-position: center bottom;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
    background-color: #fff !important
}

.form-control:is(:active, :focus),
input[type=text].form-control:is(:active, :focus) {
    background-size: 100% 2px, auto
}

.form-select {
    transition: none !important;
}

.form-select {
    background: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%23161616"/></svg> ');
    background-repeat: no-repeat;
    background-position: left 0.75rem center;
    background-size: 20px 20px;
}

.form-select:is(:active, :focus) {
    background: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path transform="rotate(180 12 12)" d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%23161616"/></svg> ');
    background-repeat: no-repeat;
    background-position: left 0.75rem center;
    background-size: 20px 20px;
}

.form-control:is(:active, :focus, :hover),
input[type=text].form-control:is(:active, :focus, :hover),
.form-select:is(:active, :focus, :hover) {
    border-color: #161616;
    outline: 0;
    color: #161616
}

.accordion-button::after {
    background-image: url('data:image/svg+xml,<svg width="20" height="20" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.60372 8.55529C6.7256 8.71666 7.08951 9.1984 7.30624 9.47611C7.74031 10.0323 8.33342 10.7714 8.97323 11.5083C9.61627 12.2489 10.2918 12.9702 10.8919 13.5005C11.1928 13.7663 11.4571 13.9684 11.6753 14.0999C11.8804 14.2235 12.0016 14.2493 12.0016 14.2493C12.0016 14.2493 12.1192 14.2235 12.3244 14.0999C12.5425 13.9684 12.8068 13.7663 13.1078 13.5005C13.7079 12.9702 14.3834 12.2489 15.0264 11.5083C15.6662 10.7714 16.2593 10.0323 16.6934 9.47608C16.9101 9.19837 17.2735 8.7173 17.3954 8.55593C17.6411 8.22241 18.1111 8.15047 18.4446 8.3961C18.7781 8.64173 18.8494 9.11123 18.6037 9.44476L18.6018 9.4473C18.474 9.61655 18.0971 10.1156 17.8759 10.3989C17.4321 10.9677 16.8216 11.7286 16.1591 12.4917C15.4997 13.2511 14.7741 14.0298 14.101 14.6245C13.7653 14.9212 13.425 15.1879 13.0988 15.3845C12.7932 15.5687 12.4063 15.75 11.9998 15.75C11.5933 15.75 11.2064 15.5687 10.9008 15.3845C10.5747 15.1879 10.2344 14.9212 9.89869 14.6245C9.22557 14.0298 8.4999 13.2511 7.84058 12.4917C7.17803 11.7286 6.5676 10.9677 6.12372 10.399C5.90243 10.1154 5.52551 9.61637 5.39793 9.44747L5.39628 9.44528C5.15064 9.11176 5.22154 8.64179 5.55506 8.39615C5.88857 8.15053 6.35808 8.22179 6.60372 8.55529Z" fill="%23161616"/></svg> ') !important;
}

.cursor-pointer {
    cursor: pointer;
}

input[type=checkbox] {
    position: relative;
    cursor: pointer;
    width: 20px;
    height: 20px;
}

input[type=checkbox]::before {
    content: "";
    display: block;
    position: absolute;
    width: 20px;
    height: 20px;
    top: 0;
    left: 0;
    border: 1px solid var(--colors-gray-500);
    background-color: var(--colors-white);
    border-radius: 2px;
}

input[type=checkbox]:focus {
    box-shadow: none !important;
    border: 2px solid #161616;
}

.evaluation {
    border-top: 2px solid #1b8354;
}

.check-bg {
    color: #1f2a37 !important;
}

.form-check-input.custom-radio-green {
    appearance: none;
    -webkit-appearance: none;
    width: 24px;
    height: 24px;
    border: 1px solid #6c727e;
    border-radius: 50%;
    background-color: #ffffff00;
    position: relative;
    transition: all 0.2s ease-in-out;
    margin-top: 0.3em;
    cursor: pointer;
}

.form-check-input.custom-radio-green:checked {
    border: 1px solid #1b8354;
}

#female:checked+label {
    color: #166a45;
}

#male:checked+label {
    color: #166a45;
}

.form-check-input.custom-radio-green:checked:hover {
    content: '';
    background-color: #21883800;
    border-radius: 50%;
    transform: scale(1);
    opacity: 1;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.form-check-input.custom-radio-green:checked::before {
    content: '';
    position: absolute;
    top: 4px;
    left: 4px;
    width: 14px;
    height: 14px;
    background-color: #1b8354;
    border-radius: 50%;
    transform: scale(1);
    opacity: 1;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.form-check-input.custom-radio-green::before {
    content: '';
    position: absolute;
    top: 4px;
    left: 4px;
    width: 14px;
    height: 14px;
    background-color: #ced0d3;
    border-radius: 50%;
    transform: scale(0);
    opacity: 0;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.custom-radio-green:hover::before {
    content: '';
    position: absolute;
    top: -9px;
    left: -9px;
    width: 40px;
    height: 40px;
    background-color: #e5e7eb;
    border-radius: 50%;
    z-index: -5;
    opacity: 1;
    transform: scale(1);
}

.form-check-input.custom-radio-green:focus {
    outline: none;
    box-shadow: 0 0 0 4px rgb(255 255 255 / 0%);
    background-color: #ffffff;
}

.form-check-input.custom-check-green {
    width: 20px;
    height: 20px;
    cursor: pointer;
}

.form-check-input.custom-check-green::before {
    content: '';
    position: absolute;
    top: 4px;
    left: 4px;
    width: 14px;
    height: 14px;
    background-color: #ced0d3;
    transform: scale(0);
    opacity: 0;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.custom-check-green:hover::before {
    content: '';
    position: absolute;
    top: -9px;
    left: -9px;
    width: 36px;
    height: 36px;
    background-color: #e5e7eb;
    border-radius: 50%;
    z-index: -5;
    opacity: 1;
    transform: scale(1);
}

.step-done {
    background-color: #1B8354;
    border-color: #1B8354;
    color: #ffffff;
}

.file-upload {
    background: #F3F4F6;
    border: 1px solid #D2D6DB;
    background-color: #F3F4F6 !important;
}

.btn-close {
    --bs-btn-close-opacity: 18.5;
    background: transparent var(--bs-btn-close-bg) center / 0.75em auto no-repeat;
}

.btn-close:focus {
    outline: 0;
    box-shadow: 0 0 0 0.1rem rgb(1 6 1);
    opacity: var(--bs-btn-close-focus-opacity);
}

.btn-close:hover {
    background-color: #F3F4F6;
}

.btn-close:active {
    background-color: #E5E7EB;
}

.grecaptcha-badge {
    visibility: hidden !important;
}

.spinner-border {
    border: 3px solid #F3F4F6 !important;
    border-left-color: #1b8354 !important;
}

#nprogress .bar {
    background: #1B8354 !important;
}

#nprogress .spinner-icon {
    border: 2px solid #F3F4F6 !important;
    border-top-color: transparent !important;
    border-left-color: #1b8354 !important;
}

.alert-danger {
    --bs-alert-color: #b42318;
    --bs-alert-bg: #fef3f2;
    --bs-alert-border-color: none;
    --bs-alert-link-color: #b42318;
    border-bottom: 2px solid #e4685e;
}

.alert-success {
    --bs-alert-color: #067647;
    --bs-alert-bg: #ecfdf3;
    --bs-alert-border-color: none;
    --bs-alert-link-color: #067647;
    border-bottom: 2px solid #62be94;
}

.alert {
    --bs-alert-border-radius: 0px;
}

.table-striped>tbody>tr:nth-of-type(odd)>* {
    --bs-table-accent-bg: #F9FAFB;
}

tbody td {
    padding: 16px !important;
}

tr th {
    padding: 16px !important;
    border-right: 1px solid #D2D6DB;
    background: #F3F4F6;
}

tbody,
td,
tfoot,
th,
thead,
tr {
    border-color: #D2D6DB;
}

.table {
    --bs-table-border-color: #D2D6DB;
}

.bg-light {
    background: #F9FAFB;
}

.text-s-14 {
    font-size: 14px;
}

.pagination .active {
    border-bottom: 3px solid #1b8354;
    margin-left: 10px;
    padding-left: 8px;
    padding-right: 7px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pagination a {
    margin-left: 10px;
    padding-left: 8px;
    padding-right: 7px;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #161616;
    border-radius: 4px;
}

.pagination .disabled {
    margin-left: 11px;
}

.pagination .disabled svg path {
    fill: #9DA4AE !important;
}


.pagination li span {
    font-size: 16px;
}

.pagination li a:focus {
    outline: #0D121C solid 2px !important;
}

.pagination a:hover {
    background: #f3f4f6;
    padding-left: 8px;
    padding-right: 7px;

}

.pagination a:active {
    background: #E5E7EB;

}

.paginate-dropdown .dropdown-menu {
    min-width: 57px;
    text-align: -webkit-center;
}

.newsBox {
    border-radius: 16px;
    border: 1px solid #D2D6DB;
    margin-bottom: 25px !important;
}

.newsBox img {
    display: block;
    border-radius: 8px;
    width: 93% !important;
    height: 226px;
    margin: auto;
    margin-top: 15px;
}

.galaryBox {
    border-radius: 16px;
    border: 1px solid #D2D6DB;
    margin-bottom: 25px;
}

.galaryBox img {
    display: block;
    border-radius: 8px;
    width: 93% !important;
    height: 250px;
    margin: auto;
    margin-top: 24px;
    margin-bottom: 24px;
}

.steps-container {
    min-height: 300px;
}

.step-item {
    cursor: pointer;
}

.step-item.active {
    font-weight: bold;
    color: #0d6efd;
}

.step-content {
    display: none;
}

.step-content.active {
    display: block;
}

.step-item.disabled {
    color: #6c757d;
    pointer-events: none;
    cursor: not-allowed;
}

.MobileStepsBox {
    background: #F9FAFB;
    border-radius: 16px;
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 24px;
    padding-bottom: 24px;
    margin-bottom: 31px;
}

@property --percentage {
    syntax: "<integer>";
    initial-value: 0;
    inherits: false;
}

.counter {
    animation: counter 5s ease-out;
    animation-fill-mode: forwards;
    counter-reset: num var(--percentage);
}

.counter::after {
    content: "";
}

@keyframes counter {
    from {
        --percentage: 0;
    }

    to {
        --percentage: var(--counter-end);
    }
}

.percentage-chart {
    width: 74px;
    height: 74px;
    position: relative;
}

.percentage-chart-bg {
    fill: none;
    stroke: #E5E7EB;
    stroke-width: 3;
}

.percentage-chart-stroke {
    fill: none;
    stroke-width: 3;
    stroke: var(--color-base);
    stroke-linecap: round;
    animation: progress 5s ease-out forwards;
}

.counter {
    position: absolute;
    left: 50%;
    top: 50%;
    font-size: 12px;
    color: var(--text-primary-paragraph);
    transform: translate3d(-50%, -50%, 0);
    font-weight: 700;
}

@keyframes progress {
    0% {
        stroke-dasharray: 0 100;
    }
}

.time-breakdown {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
}

.time-breakdown-chart {
    display: flex;
}

.time-breakdown-chart p {
    margin: 6px 0 0 0;
    color: #909090;
    font-size: 14px;
}

.time-breakdown-chart h4 {
    margin: 0;
    color: #e8e8e8;
    font-size: 18px;
    font-weight: normal;
}

.chart-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: 16px;
}

.MobileStepsDescription {
    color: var(--text-primary-paragraph);
}

.MobileStepsNext {
    color: #6C737F;
}


.bg-img {

    pointer-events: none;
    user-select: none;

}


[dir="ltr"] .bg-img {
    transform: scaleX(-1);
}

.wizard .nav-tabs {
    border-bottom: none !important;

}




.btn-mobile {
    min-width: 40px;
    height: 40px !important;
    line-height: 40px;
    text-align: center;
    color: #161616;
    cursor: pointer;
    border-radius: 4px;
    font-weight: 500;
    padding: 0px 8px;
}

.btn-mobile:hover {
    background: #F3F4F6;
}

.btn-mobile:active {
    background: #E5E7EB;

}

.btn-mobile:focus {
    outline: 2px solid #161616 !important;
}



.navbar-toggler:focus {

    box-shadow: none !important;
}


.alert-dismissible .btn-close {
    padding: 8px 8px;
    border-radius: 4px;
    top: auto;
    margin-left: 10px;
}


.accordion-menu-btn .accordion-button,
.single_menu {
    color: #212529;
    font-weight: bold;
    border: none;
    box-shadow: none;
    border-radius: 4px;
    height: 36px;
    font-size: 14px;
}

.accordion-menu-btn .accordion-button:not(.collapsed) {
    background-color: #E5E7EB;

}

.accordion-menu-btn .accordion-button:hover,
.single_menu:hover,
.accordion-menu-btn .accordion-menu-btn-list li a:hover {
    background-color: #F3F4F6;
    color: #161616 !important;
}

.single_menu:hover::before {
    content: "";
    position: absolute;
    width: 6px;
    height: 24px;
    border-radius: 50px;
    background: #9da4ae;
    margin-right: -10px;
}

.single_menu.active {
    background-color: #E5E7EB;
    color: #1B8354 !important;
}

.single_menu.active::before {
    content: "";
    position: absolute;
    width: 6px;
    height: 24px;
    border-radius: 50px;
    background: #1B8354;
    margin-right: -10px;
}


[dir="ltr"] .single_menu.active::before {
    margin-right: 0px;
    margin-left: -10px;

}

.single_menu:active::before {
    content: "";
    position: absolute;
    width: 6px;
    height: 24px;
    border-radius: 50px;
    background: #1F2A37;
    margin-left: -10px;
}




.single_menu:focus {
    outline: 2px solid #161616 !important;
}


.accordion-menu-btn .accordion-button:active,
.single_menu:active,
.accordion-menu-btn .accordion-menu-btn-list li a:active {
    background-color: #E5E7EB;
    color: #161616 !important;
}

.accordion-menu-btn .accordion-button:hover::before {
    content: "";
    position: absolute;
    width: 6px;
    height: 24px;
    border-radius: 50px;
    background: #9da4ae;
    margin-right: -20px;
}

[dir="ltr"] .accordion-menu-btn .accordion-button:hover::before {
    margin-right: 0px;
    margin-left: -20px;

}

.accordion-menu-btn .accordion-button:active::after {
    content: "";
    position: absolute;
    width: 6px;
    height: 24px;
    border-radius: 50px;
    background: #1F2A37;
    margin-right: -20px;
}


.accordion-menu-btn-button::after {
    transition: none;
}

[dir="ltr"] .accordion-menu-btn .accordion-button:active::after {
    margin-right: 0px;
    margin-left: -20px;

}



.accordion-menu-btn .accordion-menu-btn-list li a:hover::before {
    content: "";
    position: absolute;
    width: 6px;
    height: 24px;
    border-radius: 50px;
    background: #9da4ae;
    margin-right: -10px;
}

[dir="ltr"] .accordion-menu-btn .accordion-menu-btn-list li a:hover::before {
    margin-right: 0px;
    margin-left: -10px;

}


.accordion-menu-btn .accordion-menu-btn-list li a:active::before {
    content: "";
    position: absolute;
    width: 6px;
    height: 24px;
    border-radius: 50px;
    background: #1F2A37;
    margin-right: -10px;
}

[dir="ltr"] .accordion-menu-btn .accordion-menu-btn-list li a:active::before {
    margin-right: 0px;
    margin-left: -10px;

}

.accordion-menu-btn .accordion-menu-btn-list li a.active {
    background-color: #E5E7EB;
    color: #1B8354 !important;
}

.accordion-menu-btn .accordion-menu-btn-list li a.active::before {
    content: "";
    position: absolute;
    width: 6px;
    height: 24px;
    border-radius: 50px;
    background: #1B8354;
    margin-right: -10px;
}

[dir="ltr"] .accordion-menu-btn .accordion-menu-btn-list li a.active::before {
    margin-right: 0px;
    margin-left: -10px;
}

.accordion-menu-btn .accordion-body {
    background-color: #fff;
    padding: 0px;
}

.accordion-menu-btn .accordion-menu-btn-list li a,
.single_menu {
    text-decoration: none;
    display: block;
    padding: 6px 9px;
    border-radius: 4px;
}

.accordion-menu-btn-item {
    border-bottom: 1px solid #ddd;
    margin-bottom: 0.25rem;
    padding-bottom: 0.25rem;
    border-top: 0px;
}

.accordion-menu-btn-item:last-child {
    border-bottom: none;
}

.accordion-menu-btn .accordion-button:active::before {
    position: fixed;
    top: 0;
    bottom: 0;
    right: -300px;
    width: 280px;
    background: #fff;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.1);
    transition: right .3s;
    padding: 1rem;
    z-index: 1050;
    overflow-y: auto;
}

#drawer {
    position: fixed;
    top: 0;
    bottom: 0;
    right: -100%;
    width: 100%;
    background: #fff;
    transition: right .3s;
    z-index: 1050;
    overflow-y: auto;
}

#drawer.show {
    right: 0;
}

.drawer-backdrop {
    position: fixed;
    inset: 0;
    display: none;
    z-index: 1040;
}

.drawer-backdrop.show {
    display: block;
}

.feedback-hide {
    display: none;
}













@media (max-width: 576px) {

    [dir="ltr"] .min-sliderMakkah .bg-img {
        min-height: 722px;
    }

    [dir="ltr"] .min-sliderMakkah {
        min-height: 660px;
    }



}

@media (max-width: 768px) {

    [dir="ltr"] .min-sliderMakkah .bg-img {
        min-height: 722px;
    }

    [dir="ltr"] .min-sliderMakkah {
        min-height: 660px;
    }
}

@media (max-width: 992px) {


    .mhafzat {
        width: 100% !important;
    }

    .mhafzat li {
        display: block !important;
        width: auto !important;
    }

    .nav-item-tool {

        background: #f3f4f6;
        padding: 7px;
        gap: 55px;
    }




    .detailecard {
        margin-top: 15px !important;
    }
}

@media (max-width: 1200px) {
    [dir="ltr"] .min-sliderMakkah .bg-img {
        min-height: 722px;
    }

    [dir="ltr"] .min-sliderMakkah {
        min-height: 660px;
    }

    .navbar ul li a {
        font-weight: 600;
        font-size: 14px !important;
    }
}

@media (max-width: 1400px) {


    .navbar ul li a {
        font-size: 16px !important;
    }
}


#searchInput,
#searchtext {
    padding-right: 43px;
}

[dir="ltr"] #searchInput,
[dir="ltr"] #searchtext2 {
    padding-right: 0px;

    padding-left: 43px;
}

[dir="ltr"] .search-icon-en {
    margin-right: 0PX !important;
    margin-left: 10PX;
}


[dir="ltr"] .en-filter {

    direction: rtl !important;
}

[dir="ltr"] .newsBox .card-body {
    direction: ltr;
    width: 100%;
}

[dir="ltr"] .pagination-cion-1 {
    rotate: 1deg !important
}


[dir="ltr"] .pagination-cion-2 {
    rotate: 180deg !important
}


[dir="ltr"] .step-circle {
    float: left;
}

[dir="ltr"] .step-line {
    left: 23px;
    right: 0px;
}

[dir="ltr"] .form-select {
    background-position: right 0.75rem center;
}

[dir="ltr"] .stepDescription {
    margin-left: 55px;
    margin-right: none;
}

[dir="ltr"] .serviceMenubg .nav-pills .nav-link {
    text-align: left;
}


.filter-checkbox {
    display: none;
}

.filters-dropdown li {
    display: -webkit-inline-box;
}

.filter-label {
    display: inline-flex;
    height: 24px;
    padding: 0px 12px;
    justify-content: center;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
    border-radius: 4px;
    cursor: pointer;
    background-color: #f3fcf6;
    font-size: 12px;
    font-weight: 500;
}

.filter-label:hover {
    background-color: #b8eacb;
}

.filter-label:active {
    background-color: #54c08a;
}

.filter-checkbox:checked+.filter-label {
    background-color: #198754;
    color: white;
    border-color: #198754;
}

.dropdown-menu.filters-dropdown {
    padding: 15px;
    max-height: 300px;
    overflow-y: auto;
    min-width: 280px;
    border-radius: 8px;
}

#activeFilterTags {
    margin-top: 57px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    position: absolute;
}

#activeFilterTags-tawasul {
    flex-wrap: wrap;
    gap: 8px;
    direction: ltr;
    margin-bottom: 28px;

}

.active-tag {
    background-color: #198754;
    color: white;
    padding: 4px 10px;
    border-radius: 15px;
    font-size: 13px;
    cursor: pointer;
}

.active-tag:hover {
    background-color: #146c43;
}

#drawer a.active {}





@media (min-width: 576px) {

    .container {
        max-width: 942px;
    }


}


@media (min-width: 768px) {

    .container {
        max-width: 920px;
    }


}

@media (min-width: 992px) {

    .container {
        max-width: 1150px;
    }
}

@media (min-width: 1400px) {

    .container {
        max-width: 1320px;
    }
}



@media (max-width: 992px) {


    .min-slider {

        height: 730px;
    }

}

@media (max-width: 576px) {

.first-li { display: none;  } 
.first-li:nth-child(-n+4) { display: list-item; }
.whiteCard{
    padding:15px;
}

    .min-slider {

        height: 750px;
    }

    .form-control,
    input[type=text].form-control {
        padding: 0px 6px 1px 2px;
    }
}

@media (max-width: 992px) {

    .form-control,
    input[type=text].form-control {
        padding: 0px 6px 1px 2px;
    }
}

.nav-item.dropdown {
    position: static;
}

.nav-item.dropdown {
    position: static;

}

.nav-item.dropdown .dropdown-menu {
    top: 73px;
    left: 0;
    width: 100vw;
    border-radius: 0;
    margin: 0;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 1050;
    padding-top: 2rem;
    padding-bottom: 2rem;
    border: none;
}

 

.dropdown-menu .container {
    padding-left: 2rem;
    padding-right: 2rem;
}


.dropdown-menu ul.dropdown-menu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.dropdown-menu .dropdown-columns {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2px 2rem;
}


.dropdown-menu .dropdown-columns>li {
    list-style-type: none;
}

.dropdown-menu {
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    display: block;
    visibility: hidden;
}

.paginate-dropdown {
  width: 40px !important;
    transform: translateY(-4px) !important;
    transition: opacity 0.3s ease, transform 0.3s ease !important;
}

.dropdown-menu.show {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}

.form-control.is-invalid,
.was-validated .form-control:invalid {
    border-color: #b42318 !important;

}

.invalid-feedback {
    margin-top: -1.10rem;
    color: #b42318;
    font-size: 14px;
}

.mobile-profile .dropdown-menu {
    position: absolute;
}

.filteration__block-title {

    font-size: 14px;
    font-weight: 600;
}

.filters-dropdown {
    transform: none !important;
    margin-top: 43px !important;
}
 
.access-btn { width:60px; height:60px; border-radius:50%; background:#ffffff; color:#fff;
  position:fixed; bottom:20px; right:20px; display:flex; align-items:center; justify-content:center;
  cursor:pointer; font-size:30px; z-index:99999; }
.access-btn:hover {background:#54c08a;}
.tool-btn.active:hover {
    background: #104631 !important;
}
  
.tools-window { width:360px; background:#fff; border-radius:15px; padding:15px;
  position:fixed; bottom:90px; right:20px; display:none; z-index:99998;
  box-shadow:0 4px 15px rgba(0,0,0,0.2); }
.tool-btn { display: flex; align-items: center; justify-content: start; gap: 0.5rem; }
.tool-btn .icon { font-size: 18px; }
.tool-btn.active { background:#198754 !important; color:white !important; font-weight:bold; }
.tool-btn.active { background:#198754 !important; color:white !important; font-weight:bold; }

.readableFont { font-family: Arial, sans-serif !important; }
.lineSpacing { line-height: 2 !important; }
.wordSpacing { word-spacing: 0.3em !important; }
.highlightLinks a { background: yellow !important; }
.zoomLevel1 { font-size: 120%; }
.zoomLevel2 { font-size: 140%; }
.zoomLevel3 { font-size: 160%; }
.reading-mask { position: fixed; left: 0; width: 100%; height: 4em; background: rgba(255, 255, 0, 0.3); pointer-events: none; z-index: 9997; display: none; }
.hide-images img { opacity: 0 !important; }
.reading-guide { position: fixed; width: 100px; height: 20px; background: rgba(0,128,255,0.3); pointer-events: none; z-index: 9997; display: none; }
.reading-guide::after { content: ""; position: absolute; top: -10px; left: 50%;
  transform: translateX(-50%);
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 10px solid rgba(0,128,255,0.8); }
.nightMode , .nightMode footer , .nightMode .gray-bg  ,.nightMode .card , .nightMode  .navbar ,.nightMode .subnav , .nightMode .whiteCard  ,.nightMode .newsBox   { background: #121212 !important; color: #eee !important; }
.nightMode a { color: #ffffff !important; }
 .nightMode  .lightBox ,  .nightMode .dropdown-menu {
     background: #3f3f3f !important; color: #eee !important; 
 }
 
  .nightMode .aboutBox ,  .nightMode .tag-gray    ,.nightMode .lightBox ,  .nightMode .detailecard  ,.nightMode .pageBg ,.nightMode .btn-secondary ,  .nightMode .whiteBox   ,  .nightMode .card-icon-square ,.nightMode .bannerButton {
background: #121212 !important;
border: 1px solid #ffffff !important;
color: #ffffff !important;
 }
 .nightMode h4 ,  .nightMode .aboutDescription ,  .nightMode .pageTitle ,.nightMode .nav-link , .nightMode .list-group-item , .nightMode .aboutTitle  ,.nightMode  label ,.nightMode .detaileTitle   {
color: #ffffff !important;
}

.nightMode  .pageServiceFormBg {
  background: #121212 !important;  
}


.highlightParagraphs p { background: #fffa65; }


.required-icon {
 color: #b42318 !important;
    direction: unset !important;
    font-family: IBM Plex Sans Arabic !important;
    font-size: 13px;
    font-weight: bolder !important;
    margin-left: 3px !important;
}
    