#nprogress .bar {
    background: #3f78e0
}

.svg-icon-colr {
    fill: #3f78e0
}

.bottom-nav-buttom {
    z-index: 1000;
    box-shadow: 0 -2px 8px #00000029
}

@keyframes progress {
    0% {
        left: -30%;
        width: 30%
    }

    50% {
        left: 50%;
        width: 30%
    }

    to {
        left: 100%;
        width: 30%
    }
}

html, body {
    overflow-x: clip
}

* {
    box-sizing: border-box
}

.add-loader {
    position: relative;
    overflow: hidden
}

.add-loader.is-loading:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40%;
    height: 2px;
    background-color: #3b82f6;
    animation: slide-bounce 1.5s ease-in-out infinite
}

@keyframes slide-bounce {
    0% {
        left: 0
    }

    50% {
        left: 60%
    }

    to {
        left: 0
    }
}

.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none
}

.animate-progress {
    animation: progress 1.5s ease-in-out infinite alternate
}

.heading-color {
    color: #343f52 !important
}

.input-height {
    height: 58px
}

.fill-primary {
    color: #3f78e0 !important
}

.bg-line.red {
    background: repeating-linear-gradient(-55deg, #fff0 .8px, #e2626b 1.6px 3px, #fff0 3.8px 10px)
}

.hide-horizontal-scrollbar::-webkit-scrollbar {
    display: none
}

.hide-horizontal-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none
}

.hide-vertical-scrollbar {
    overflow-y: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.hide-vertical-scrollbar::-webkit-scrollbar {
    display: none
}

.bg-line.primary {
    background: repeating-linear-gradient(-55deg, #fff0 .8px, #3f78e0 1.6px 3px, #fff0 3.8px 10px)
}

.navigation-wrapper {
    position: relative
}

.loader {
    display: flex;
    justify-content: center
}

.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    margin-bottom: 1rem;
    list-style: none;
    background-color: none;
    border-radius: 0
}

.dot {
    border: none;
    width: 6px;
    height: 6px;
    background: #c5c5c5;
    border-radius: 50%;
    margin: 0 5px;
    padding: 5px;
    cursor: pointer
}

.dot:focus {
    outline: none
}

.dot.active {
    background: #000
}

.arrow {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    fill: #fff;
    cursor: pointer
}

.arrow--left {
    left: 5px
}

.arrow--right {
    left: auto;
    right: 5px
}

.arrow--disabled {
    fill: #ffffff80
}

progress::-webkit-progress-value {
    background-color: #facc15
}

progress::-webkit-progress-bar {
    background-color: silver;
    border-radius: 100px
}

.bg-dot.yellow {
    background-image: radial-gradient(#fab758 2px, transparent 2.5px)
}

.underline-3 {
    position: relative;
    z-index: 1
}

.underline-3.style-3:after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 205 9.37'%3E%3Cpath fill='%233f78e0' d='M202.47,9.37A1191.26,1191.26,0,0,0,1.79,7.48,1.67,1.67,0,0,1,0,5.92H0A1.76,1.76,0,0,1,1.63,4.21c67-5.71,133.83-5.43,200.8-.27A2.75,2.75,0,0,1,205,6.88h0A2.6,2.6,0,0,1,202.47,9.37Z'/%3E%3C/svg%3E")
}

.underline-3:after {
    content: "";
    position: absolute;
    z-index: -1;
    display: block;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: bottom;
    left: 50%;
    bottom: -.1em;
    width: 110%;
    height: .3em;
    transform: translate(-50%)
}

.underline-1 {
    position: relative;
    z-index: 2;
    white-space: nowrap
}

.underline-1:after {
    content: "";
    display: block;
    background: #3f78e01f;
    border-radius: 5rem;
    position: absolute;
    width: 102.5%;
    height: 30%;
    left: -1.5%;
    bottom: 9%;
    z-index: -1;
    margin-top: 0;
    transition: all .2s ease-in-out
}

.on {
    color: #fb8900
}

.off {
    color: #bebebe
}

.react-modal-sheet-container {
    border-top-left-radius: 20px !important;
    border-top-right-radius: 20px !important
}

.navbar-clone {
    width: 100%;
    position: sticky !important;
    z-index: 500;
    top: 0;
    left: 0;
    transform: translateY(-100%);
    transition: all .3s ease-in-out
}

[data-rsbs-overlay], [data-rsbs-backdrop], [data-rsbs-root]:after {
    z-index: 1010 !important
}

[data-rsbs-overlay], [data-rsbs-root]:after {
    height: -moz-max-content !important;
    height: max-content !important
}

[data-rsbs-overlay] {
    border-top-right-radius: 15px !important;
    border-top-left-radius: 15px !important
}

.navbar-stick {
    transform: translateY(0);
    background-color: #fff !important;
    box-shadow: 0 0 1.25rem #1e22280f;
    background-color: #fffffff7
}

.navbar-unstick {
    transform: translateY(0)
}

.spinner {
    border-radius: 50%;
    border-left-color: #3f78e0;
    animation: spin 1s linear infinite
}

@keyframes spin {
    0% {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.animate-pulse {
    animation: pulse 1.5s cubic-bezier(.4, 0, .6, 1) infinite
}

.delay-1 {
    animation-delay: .1s
}

.delay-2 {
    animation-delay: .4s
}

.delay-3 {
    animation-delay: .8s
}

::marker {
    unicode-bidi: none !important
}

.service-description-html ::not(.gh-content) p, .service-description-html ::not(.gh-content) ul, .service-description-html ::not(.gh-content) ol, .service-description-html ::not(.gh-content) dl, .service-description-html ::not(.gh-content) blockquote {
    margin: 0 0 1.5em
}

.service-description-html p {
    margin-bottom: 10px
}

.service-description-html ol, .service-description-html ul {
    padding-left: 1.3em
}

.service-description-html ol ol, .service-description-html ul ul, .service-description-html ul ol, .service-description-html ol ul {
    margin: .5em 0 1em
}

.service-description-html ul {
    list-style: disc
}

.service-description-html ol {
    list-style: decimal
}

.service-description-html ul, .service-description-html ol {
    max-width: 100%
}

.service-description-html li {
    padding-left: .3em;
    line-height: 1.6em
}

.service-description-html li+li {
    margin-top: .5em
}

.service-description-html h1, .service-description-html h2, .service-description-html h3, .service-description-html h4, .service-description-html h5, .service-description-html h6 {
    margin-top: 0;
    line-height: 1.15;
    font-weight: 600;
    text-rendering: optimizeLegibility;
    letter-spacing: -.01em
}

.service-description-html h2 {
    margin: 1.5em 0 .5em;
    font-size: 1.5rem;
    font-weight: 600
}

@media (max-width: 600px) {
    .service-description-html h2 {
        font-size: 1.25rem
    }
}

.service-description-html h3 {
    margin: 1.5em 0 .5em;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.5
}

@media (max-width: 600px) {
    .service-description-html h3 {
        font-size: 1.125rem
    }
}

.service-description-html h4 {
    margin: 1.5em 0 .5em;
    font-size: 1.125rem
}

.service-description-html h5 {
    margin: 1.5em 0 .5em;
    font-size: 1rem
}

.service-description-html b {
    margin: 1.5em 0 .5em;
    font-weight: 600
}

.service-faq-html div, .service-description-html div {
    margin-bottom: 15px
}

.service-description-html img {
    border-radius: .7rem;
    padding: .2rem
}

.service-description-html hr.markdown-divider {
    margin: 2rem 0;
    height: 0;
    border: none;
    border-top: 5px solid #e5e7eb;
    position: relative;
    left: 50%;
    width: 100vw;
    transform: translate(-50%);
    padding: 0
}

@media (min-width: 1024px) {
    .service-description-html hr.markdown-divider {
        width: 105%
    }
}

.service-description-html hr.markdown-divider-thin {
    margin: 2rem 0;
    height: 0;
    border: none;
    border-top: 2px solid #e5e7eb;
    position: relative;
    left: 50%;
    width: 100vw;
    transform: translate(-50%);
    padding: 0
}

@media (min-width: 1024px) {
    .service-description-html hr.markdown-divider-thin {
        width: 105%
    }
}

.service-description-html table {
    width: 100%;
    table-layout: auto;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1))
}

.service-description-html th, .service-description-html td {
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
    padding: .5rem 1rem;
    text-align: left
}

.service-description-html th {
    font-weight: 500
}

.swiper {
    width: 100%;
    height: 100%
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center
}

.swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.sb-overlay {
    z-index: 1000
}

.sb-content {
    height: -moz-fit-content;
    height: fit-content;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px
}

.sb-handle-container {
    display: none !important
}

.sidenavbar {
    position: relative
}

.sidenav {
    width: 250px;
    position: fixed;
    top: 0;
    z-index: 1010;
    left: -250px;
    transition: .5s
}

.lg-show-in .lg-toolbar, .lg-counter, .lg-show-in, .lg-prev, .lg-show-in .lg-next, .lg-show-in .lg-pager-outer, .lg-toolbar .lg-icon {
    color: #fff !important
}

.lg-backdrop {
    background-color: #000 !important;
    opacity: .8 !important
}

.sidenav.open {
    left: 0;
    width: 100%
}

.hide-scrollbar::-webkit-scrollbar {
    display: none
}

.date-picker-input {
    padding-left: 20px !important
}

.SimpleDatepicker {
    box-shadow: none !important;
    --sd-button-height: 3.5rem;
    --sd-button-width: 3.5rem;
    --sd-primary-color: #3f78e0;
    --sd-primary-hover-color: #3f78e0
}

@media (max-width: 600px) {
    .SimpleDatepicker {
        --sd-button-height: 3rem;
        --sd-button-width: 3rem
    }
}

details>summary::-webkit-details-marker {
    display: none
}

.full-width-hr {
    margin: 0;
    height: 0;
    border: none;
    border-top: 5px solid #e5e7eb;
    position: relative;
    left: 50%;
    width: 100vw;
    transform: translate(-50%)
}

.border-radius-custom {
    border-radius: 50px 0 !important
}

@keyframes moveVehicle {
    0% {
        left: -120px
    }

    to {
        left: calc(100% + 120px)
    }
}

.move-vehicle {
    animation: moveVehicle 15s linear infinite
}

#popup-container {
    position: relative
}

.ScrollToTop {
    position: absolute;
    bottom: 20px;
    right: 20px
}