a.nav-link:hover {
    color:#ff6f43 !important;
}
.progress-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    margin: auto;
}
.progress-container::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 100%;
    height: 4px;
    background: #ddd;
    transform: translateY(-50%);
    z-index: 0;
}
.progress-bar {
    position: absolute;
    top: 50%;
    right: 0;
    left: auto;
    width: 0;
    height: 4px;
    background: #ff6f43;
    transition: width 0.4s ease-in-out;
    transform: translateY(-50%);
    z-index: -1;
}
.step {
    width: 40px;
    height: 40px;
    background: #ddd;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-weight: bold;
    position: relative;
    transition: background 0.3s;
}
.step.active {
    background: #ff6f43;
}
.form-step {
    display: none;
    margin: auto;
}
.form-step.active {
    display: block;
}
.form-step input {
    width: 100%;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #ccc;
    border-radius: 5px;
}
html[dir="ltr"] body, html[dir="ltr"] input, html[dir="ltr"] button, html[dir="ltr"]  select, html[dir="ltr"]  textarea {
    font-family: 'Poppins', sans-serif !important;
}

body, body input, body button, body select, body textarea {
    font-family: 'Cairo', sans-serif !important;
}

/*body {*/
/*    font-family: "Zain", serif;*/
/*    text-align: right;*/
/*    overflow-x: hidden;*/
/*}*/
a {
    text-decoration: none;
}
.full-width {
    display: block;
    width: 100%;
}
.FlexBox {
    display: flex;
    justify-content:center;
    align-items:center;
}
.p-2 {
    padding: 2px;
}
.padding-5 {
    padding: 5px;
}
.br-5 {
    border-radius: 5px;
}
.br-10 {
    border-radius: 10px;
}
.card-white {
    background: #fff;
    padding: 25px;
}
.full-radius {
    border-radius: 100px !important;
}
.sec-btn {
    background: #131d3d;
    border-radius: 10px;
    font-size: 18px;
    text-decoration: none;
    padding: 11px 24px 0 24px;
    color: #fff;
    display: inline-block;
    text-align: center;
}
.btn-main-color {
    background: #ff6f43;
    border-radius: 10px;
    font-size: 18px;
    text-decoration: none;
    padding: 8px 24px 8px 24px;
    color: #fff;
    text-align: left;
    border-style: none;
    margin-right:auto;
}
.btn-border-main-color {
    background: #fff;
    border-radius: 10px;
    font-size: 18px;
    text-decoration: none;
    padding: 8px 24px 8px 24px;
    color: #ff6f43;
    display: inline-block;
    text-align: center;
    border: 1px solid #ff6f43;
}
.btn-danger-color {
    background: #bc3226;
    border: 1px solid #bc3226;
}
.sec-btn i {
    padding-right: 10px;
}
input:not(.floating-input):not(.form_numbers):not(footer input):not([name="rate"]),
select:not(footer select),
textarea:not(footer textarea) {
    display: block;
    width: 100%;
    border-style: none !important;
    border-radius: 13px;
    outline: none;
    padding: 10px 20px;
}

.dark-input, .dark-select, .dark-textarea {
    display: block !important;
    width: 100% !important;
    border-style: none !important;
    background: #efefef !important;
    margin-bottom: 20px !important;
    border-radius: 8px !important;
    outline: none !important;
    padding: 12px 20px !important;
}
.box-input {
    border: 1px solid #ff6f43;
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 30px;
}
.box-input input, .box-input select {
    display: inline-block;
    width: auto;
    border-style: none !important;
    margin-bottom: 0;
    padding: 0;
}
.box-input i {
    font-size: 22px;
    color: #ff6f43;
}
.box-input span {
    font-size: 26px;
    padding: 0 10px;
    display: inline-block;
    color: #ff6f43;
}
.box-input label {
    position: absolute;
    margin-top: -23px;
    background: #fff;
    padding: 0 18px;
    color: #686868d7;
    font-size: 18px;
}
.card {
    border-radius: 20px;
    background: #673ab708;
}
.btn-action {
    font-size: 20px;
    padding: 10px;
    color: var(--bs-indigo);
    cursor: pointer;
    background: transparent;
    border-style: none;
    font-weight: 900;
}
.btn-action .fa-trash-alt {
    color: var(--bs-red);
}
.swapCities {
    position: absolute;
    right: 192px;
    top: 12px;
    color: #ffffff;
    width: 25px;
    cursor: pointer;
    font-size: 13px;
    background: #000;
    height: 25px;
    border-radius: 30px;
    padding: 5px 7px;
}
.custom-checkbox {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 16px;
    color: #333;
    user-select: none;
}
.custom-checkbox input {
    display: none;
}
.custom-checkbox .checkmark {
    width: 20px;
    height: 20px;
    border: 2px solid #007bff;
    border-radius: 4px;
    display: inline-block;
    margin-right: 10px;
    position: relative;
    background: #fff;
    transition: background 0.3s ease, border-color 0.3s ease;
}
.custom-checkbox input:checked + .checkmark {
    background-color: #007bff;
    border-color: #007bff;
}
.custom-checkbox .checkmark::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 6px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: translate(-50%, -50%) rotate(45deg);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.custom-checkbox input:checked + .checkmark::after {
    opacity: 1;
}
.btn-register {
    padding: 20px;
    display: block;
    font-size: 22px;
}
.btns-login {
    background: aliceblue;
    display: table;
    margin: auto;
    padding: 14px 7px;
    border-radius: 38px;
    font-weight: 500;
}
.btns-login a {
    padding: 10px 20px;
    border-radius: 33px;
    letter-spacing: 1px;
    font-size: 18px;
}
.btns-login .active {
    background: var(--bs-blue);
    color: #fff;
}
.menu-right {
    background: #cff4fc17;
    height: 100vh;
}
.menu-right li {
    font-size: 20px;
    list-style: none;
    padding: 10px;
}
.menu-right li i {
    font-weight: 300;
    width: 35px;
    color: #969cba;
    text-align: center;
}
.menu-right li a {
    color: #969cba;
}
.menu-right .active-menu {
    background: #ff6f43;
    color: #fff;
    border-radius: 10px;
}
.active-menu a, .active-menu i {
    color: #fff !important;
}
.main-color {
    color: #ff6f43;
}
.btn-action {
    font-size: 20px;
    padding: 9px;
    cursor: pointer;
    background: transparent;
    border-style: none;
    font-weight: 900;
    width: 40px !important;
    height: 40px !important;
    color: #fff;
    border-radius: 100px;
    display: inline-block;
}
.bg-gray {
    background-color: gray;
}
.bg-red {
    background-color: #ff3d00;
}
.form-icon {
    border-radius: 80px;
    position: relative;
    display: flex;
    padding: 0 5px;
    margin-bottom: 20px;
}
.form-icon label {
    display: inline-block;
    position: absolute;
    top: -11px;
    background: #fff;
    padding: 0 10px;
    color: #6B6B6B;
    font-size: 15px;
}
.form-icon input, .form-icon select {
    width: 100%;
    display: inline-block;
    margin-bottom: 0;
    border-style: none !important;
    padding: 10px 0;
}
.form-join-car .col-md-2 {
    padding: 3px;
}
.form-icon i {
    border-radius: 80px;
    position: relative;
    padding: 12px 2px;
    font-size: 18px;
    color: #ff6f43;
}
.form-icon input {
    flex: 1;
    border: none;
    background: transparent;
    font-size: 16px;
    outline: none;
    appearance: none;
}
.form-icon i {
    cursor: pointer;
}
.book-car .car-card img {
    width: 100%;
    height: 80px;
}
.left-section {
    background-size: cover !important;
    background-position: center !important;
}
.input-light-icon {
    background: #F4F6F9;
    border-radius: 8px;
}
.input-light-icon input {
    border-style: none !important;
    background: transparent;
    margin-bottom: 0;
    width: 100%;
}
.input-light-icon i {
    padding: 14px;
    font-size: 20px;
    cursor: pointer;
}
.login-form {
    margin: 40px auto;
}
@media (max-width: 768px) {
    .left-section {
        height: auto;
        padding: 50px;
    }
    .login-form {
        height: auto;
    }
    .login-container {
        height: auto;
    }
    .right-section {
        margin: auto;
    }
}
.small-btn {
    font-size: 15px;
    padding: 4px 13px;
}
.calendar-container {
    max-width: 1000px;
    margin: auto;
}
.calendar-container .calendar-table td {
    width: 140px;
    height: 63px;
    text-align: center;
    cursor: pointer;
    font-size: 20px;
}
.calendar-container .selected {
    background-color: #ff6f43!important;
    color: white;
    transition: background-color 0.3s ease;
}
.calendar-container .selected-red {
    background-color: #ff6f43!important;
    color: white;
    transition: background-color 0.3s ease;
}
.calendar-container .in-range {
    background-color: #eee !important;
    color: black;
    transition: background-color 0.3s ease;
}
.calendar-container .form-control {
    width: 100%;
    max-width: 1000px;
    text-align: center;
    font-size: 18px;
    padding: 10px;
    border: 2px solid #ff6f43;
    border-radius: 10px;
    margin: auto;
    display: block;
}
.calendar-container .month-slider {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    width: 100%;
    padding: 10px;
    background-color: #f1f1f1;
}
.calendar-container .month-slider-item {
    margin: 0 10px;
    cursor: pointer;
    font-size: 20px;
    padding: 5px;
    transition: background-color 0.3s ease;
}
.calendar-container .month-slider-item:hover {
    background-color: #ff6f43;
    color: white;
    border-radius: 5px;
}
.section_travel .active, .section_hour .active {
    background: #ff6f4326;
    border: none !important;
    border-radius: 20px;
}
.aaa {
    overflow: hidden;
    width: 100%;
    margin: 0 auto;
    position: relative;
}
.cars .checkbox-option {
    width: 150px;
    border: 1px solid #707070;
    border-radius: 17px;
}
.horizontal-scroll {
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 15px;
    scrollbar-width: auto;
    scroll-behavior: smooth;
}
.horizontal-scroll::-webkit-scrollbar {
    display: block;
    height: 8px;
}
.horizontal-scroll::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 10px;
}
.horizontal-scroll::-webkit-scrollbar-thumb:hover {
    background: #555;
}
.cars {
    display: inline-block;
    white-space: nowrap;
}
.cars label {
    display: inline-block;
    width: 220px;
    margin: 0 2px;
    transition: all 0.3s ease;
    background: #fff;
    border-radius: 8px;
    vertical-align: top;
    cursor: pointer;
    position: relative;
}
.car-card {
    padding: 15px;
    text-align: center;
}
.car-card h5 {
    color: #333;
    font-size: 16px;
}
.car-card img {
    height: 60px;
    object-fit: contain;
}
.car-card span {
    display: block;
    color: #666;
    font-size: 14px;
    margin-top: 5px;
}
#price_ford_taurus, #price_james, #price_camry, #price_staria, #price_vip, #price_hayes, #price_businessmen {
    display: block;
    font-weight: bold;
}
.slider-indicators {
    text-align: center;
    margin-top: 10px;
    padding-bottom: 10px;
    display: none;
}
.slider-indicators .indicator {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ccc;
    margin: 0 5px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.slider-indicators .indicator.active {
    background: #ff6f43;
    transform: scale(1.2);
}
.show-after-query {
    display: none;
}
.show-after-query.visible {
    display: block;
}
.radio-container {
    display: flex;
    margin-bottom: 20px;
}
.radio-item {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    position: relative;
    padding:0 0 10px 15px;
}
.radio-item input[type="radio"] {
    display: none;
}
.radio-button {
    width: 20px;
    height: 20px;
    border: 2px solid #ff6f43;
    border-radius: 50%;
    position: relative;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    background-color: white;
}
.radio-button::after {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #ff6f43;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: all 0.3s ease;
}
.radio-item input[type="radio"]:checked + .radio-button {
    border-color: #ff6f43;
    background-color: #eaf4ff;
    box-shadow: 0 0 12px 0 #ff6f438a;
}
.radio-item input[type="radio"]:checked + .radio-button::after {
    transform: translate(-50%, -50%) scale(1);
}
.radio-label {
    font-size: 16px;
    user-select: none;
    transition: color 0.3s ease;
}
.radio-item:hover .radio-label {
    color: #ff6f43;
}
input[type="checkbox"] {
    display: none;
}
.custom-checkbox {
    display: inline-block;
    width: 25px;
    height: 25px;
    border: 2px solid #ff6f43;
    border-radius: 4px;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;
}
input[type="checkbox"]:checked + .custom-checkbox::after {
    content: "✔";
    font-size: 18px;
    color: white;
    position: absolute;
    top: 61%;
    left: 50%;
    transform: translate(-50%, -50%);
}
input[type="checkbox"]:checked + .custom-checkbox {
    background-color: #ff6f43;
    border-color: #ff6f43;
}
.toggle-container {
    display: flex;
    align-items: center;
    gap: 10px;
}
.toggle-container .label-text {
    width: 100px;
}
.toggle-switch {
    position: relative;
    width: 50px;
    height: 25px;
}
.toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}
.toggle-switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    border-radius: 20px;
    transition: 0.4s;
}
.toggle-switch .slider::before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 4px;
    bottom: 3.5px;
    background-color: white;
    transition: 0.4s;
    border-radius: 50%;
}
.toggle-switch input:checked + .slider {
    background-color: #ff6f43;
}
.toggle-switch input:checked + .slider::before {
    transform: translateX(24px);
}
.toggle-switch .label-text {
    font-size: 18px;
    color: #333;
    font-weight: bold;
}
body {
    background: #fff;
    overflow-x: hidden;
}
.nav-item button{
    background:#fff;
    border-radius: 0.374rem;
    outline:none;
    border:none;
    cursor:pointer;
}
.lang-btn {
    display: flex;
    align-items: center;
    gap: 5px;
    background: none;
    border: none;
    font-size: 16px;
    color: #333;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 6px;
    transition: background 0.2s ease;
}
.lang-btn i {
    color: #ff6f43;
    font-size: 16px;
}
@media (max-width: 480px) {
    .lang-btn {
        font-size: 14px;
        padding: 5px 8px;
    }
    .lang-btn i {
        font-size: 14px;
    }
}
.bg-body-tertiary {
    --bs-bg-opacity: 1;
    background-color: rgb(0 0 0) !important;
}
.navbar-nav {
    margin-right: auto;
    margin-left: 0;
}
.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
    color: rgb(255 255 255);
}
.join-now .box {
    padding: 10px;
}
.join-now .box strong {
    font-size: 20px;
    padding: 40px;
}
.join-now .box a {
    font-size: 20px;
    margin-right: auto;
}
.contact-section {
    background-size: cover !important;
    background-position: center !important;
}
.contact-section .overlay {
    background: #3838389e;
    padding: 100px 0;
}
.contact-section .box {
    background: #fff;
    padding: 35px;
    border-radius: 10px;
}
.contact-section button {
    background: #ff6f43;
}
.contact-section h2 {
    font-size: 45px;
}
.contact-section p {
    font-size: 20px;
}
.contact-section i {
    background: #fff;
    padding: 15px;
    color: #ff6f43;
    font-weight: 500;
    font-size: 25px;
    border-radius: 40px;
    width: 58px;
    height: 60px;
    margin-left: 20px;
    text-align: center;
}
.upperbar {
    background: #000000cf;
    color: #fff;
    text-align: center;
    padding: 100px;
}
.faqs .content {
    background: #f3f3f3;
    padding: 30px;
    margin-top: -67px;
    border-radius: 20px;
}
.accordion-button:not(.collapsed) {
    color: var(--bs-accordion-active-color);
    background: none;
    box-shadow: none;
}
.accordion-button::after {
    display: none !important;
}
.d-flex {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
}
.accordion-item {
    background: #fff;
    border-radius: 10px;
    margin-bottom: 10px;
    padding: 10px;
    border:none !important;
}
.toggle-button {
    width: 35px;
    height: 35px;
    background-color: orange;
    border: none;
    border-radius: 0.374rem;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.3s ease-in-out;
}
.loyalty {
    background-position: center !important;
    background-size: cover !important;
}
.loyalty .overlay {
    background: #4f4f4fbd;
}
.loyalty .overlay div {
    font-size: 35px;
    color: #fff;
    padding: 300px 80px;
    text-align: center;
    max-width: 992px;
    display: table;
    margin: auto;
}
.loyalty a {
    color: #ff6f43;
}
.login-container {
    display: flex;
    width: 100%;
}
.left-section {
    background-size: cover;
    background-repeat: no-repeat !important;
    flex: 1;
    display: flex;
    align-items: self-start;
    justify-content: center;
    color: white;
    font-size: 24px;
    font-weight: bold;
    text-align: center;
    overflow: hidden;
}
.left-section .overlay{
    margin-top:160px;
    font-size:30px;
}
.left-section .overlay button{
    font-size:30px;
}
.right-section {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
}
.login-form {
    width: 100%;
    max-width: 500px;
    padding: 45px;
    border-radius: 20px;
    background: #fff;
    overflow:hidden;
}
.btn-primary {
    background-color: #ff6f43;
    border: none;
}
.btn-primary:hover {
    background-color: #e65c00;
}
.social-login img {
    width: 40px;
    margin: 5px;
}
.title-line {
    border-bottom: 2px solid #ccc;
    padding-bottom: 10px;
}
.title-line a {
    color: #000;
    padding: 20px;
    position: relative;
    top: 11px;
    width: auto;
    display: inline-block;
}
.agency_registration .box {
    background: #f8f8f8;
    margin-top: -119px;
    padding: 50px;
    border-radius: 20px;
}
.agency_registration ul li, .agency_registration p {
    color: #7a7878;
}
.terms-section {
    padding: 50px 0;
    background: #fff
}
.terms-title {
    font-size: 28px;
    color: #ff6f00;
    font-weight: bold;
    margin-bottom: 30px;
}
.terms-container {
    display: flex;
    justify-content: center;
    gap: 50px;
    flex-wrap: wrap;
}
.term-box {
    width: 250px;
    text-align: center;
    border:none;
}
.term-box img {
    width: 200px;
    height: 200px;
    margin-bottom: 15px;
    border-radius: 100px;
    padding: 23px;
    background: #fff;
}
.term-box h3 {
    font-size: 18px;
    color: #333;
    font-weight: bold;
}
.term-box p {
    font-size: 14px;
    color: #666;
}
.terms-details h2 {
    color: #000;
}
.why-choose-us {
    background: #fff
}
.services {
    background-size: cover !important;
    background-position: center !important;
}
.services .overlay {
    background: #f0f8ffed;
}
.about {
    padding: 100px 0;
}
.about i {
    font-size: 40px;
    padding: 3px 0 0 29px;
    color: #ff6f43;
}
.about .img-fluid {
    max-width: 100%;
    height: auto;
    border-radius: 30px;
}
.about h5 {
    font-size: 31px;
    padding: 22px;
}
.about p {
    font-size: 18px;
    color: #646363;
}
.home-searvice {
    background: #ffffff00;
    padding: 20px 0 40px;
    text-align: center;
}
.home-searvice .title {
    color: #ff6f43;
    font-size: 24px;
    margin-bottom: 10px;
}
.home-searvice .subtitle {
    color: #555;
    margin-bottom: 20px;
}
.home-searvice .services {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}
.home-searvice .service-card img {
    width: 100%;
    border-radius: 10px;
}
.home-searvice .service-card h3 {
    color: #ff6f43;
    margin-top: 10px;
}
.home-searvice .service-card p {
    color: #777;
}
.home-searvice .service-card button {
    background-color: #ff6f43;
    color: white;
    border: none;
    padding: 8px 15px;
    margin-top: 10px;
    cursor: pointer;
    border-radius: 5px;
}
.home-searvice .buttons button {
    margin: 3px;
    border-radius: 100px;
    padding: 6px 22px;
}
.testimonials .box {
    background: #ff6f43;
    color: #fff;
    border-radius: 17px;
    margin: 20px;
}
.testimonials .box p {
    font-size: 20px;
}
.testimonials .box .stars I {
    color: #fff600;
}
.testimonials .FlexBox {
    text-align: right
}
.testimonials .FlexBox h5 {
    margin-bottom: 0;
}
.testimonials .owl-carousel .owl-item img {
    display: block;
    width: 64px;
}
.testimonials .fa-quote-right {
    position: absolute;
    color: #ffffffbd;
    font-size: 52px;
    bottom: 43px;
    left: 59px;
}
.accordion-button::after {
    display: none !important;
}
.d-flex {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
}
.accordion .toggle-button {
    width: 35px;
    height: 35px;
    background-color: #ff6f43;
    border: none;
    border-radius: 0.375rem;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.3s ease-in-out;
    color: #fff;
    text-align: center;
    padding: 8px;
    display: inline-block;
}
button .toggle-button svg {
    transition: transform 0.3s ease;
}
button[aria-expanded="true"] .toggle-button svg {
    transform: rotate(180deg);
}
.accordion .accordion-button {
    background: none;
    border: none;
    font-size: 18px;
    color: black;
    width: 100%;
    text-align: right;
    box-shadow: none !important;
}
#imagePreviewContainer {
    display: none;
    margin-top: 10px;
}
#imagePreview {
    max-width: 200px;
    border: 1px solid #ccc;
    padding: 5px;
    border-radius: 8px;
}
#removeBtn {
    margin-top: 10px;
    background-color: #e74c3c;
    color: white;
    border: none;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
}
#fileName {
    display: block;
    margin-top: 8px;
    font-size: 14px;
    color: #333;
}
.book-car .car-card {
    border-radius: 17px;
    padding: 15px;
}
.book-car {
    margin-top: -190px;
}
.header {
    color: #fff;
    background-position: center !important;
    background-size: cover !important;
}
.header span {
    background: #ff6f43;
    padding: 12px 20px;
    margin: 36px 0;
    display: block;
}
.buttons button {
    background: #fff;
    padding: 6px 20px;
    transform: skewX(-33deg);
    border-style: none;
}
.buttons button {
    background: #fff;
    padding: 6px 20px;
    transform: skewX(-23deg);
    border-style: none;
    margin: 0 2px;
}
.buttons button div {
    transform: skewX(23deg);
}
.buttons .active {
    background: #ff6f43;
    color: #fff
}
.buttons a {
    color: #000
}
.buttons .active a {
    color: #fff
}
.header .overlay {
    padding: 80px 200px 180px;
    background: #ff6f4333;
}
.cars-container {
    margin-top: -97px;
}
#cars {
    background: #fff;
    padding: 30px;
}
#cars .filter select {
    display: inline-block;
    width: auto;
    background: transparent;
    border-style: none !important;
    margin-bottom: 0;
    color: #FFF
}
#cars .filter select option {
    background: #e65c00;
}
#cars .filter {
    color: #fff;
    background: #e65c00;
    margin-bottom: 30px;
    padding: 8px 15px;
    border-radius: 10px
}
#cars .card {
    position: relative;
    overflow: hidden;
    background: #fff
}
#cars .FlexBox div {
    padding: 10px;
}
#cars .FlexBox div i {
    padding: 5px;
}
#cars .box {
    background: #ff6f43;
    padding: 101px;
    border-radius: 64px;
    transform: rotateZ(-30deg);
    /*width: 476px;*/
    /*left: 6px;*/
    /*position: relative;*/
    /*top: -77px;*/
    width: 600px;
    left: 14%;
    position: relative;
    top: -90px;
}
#cars a {
    text-decoration: none;
    color: #e65c00;
}
.card-img, .card-img-top {
    margin-top: -166px;
    z-index: 99;
}
#cars .category-badge {
    position: absolute;
    display: block;
    text-align: left;
    width: 92%;
    z-index: 99;
    font-size: 34px;
    color: #fff;
    font-weight:bold;
}
.buttons button {
    background: #fff;
    padding: 6px 20px;
    transform: skewX(-23deg);
    border-style: none;
    margin: 0 2px;
}
.list-view-car .box {
    background: #9e9e9e21;
    height: auto;
}
.list-view-car .FlexBox div {
    padding: 10px;
}
.modal .btn-close {
    left: 19px;
    position: absolute;
}
.plans .box {
    position: relative;
}
.plans .card {
    background: #fff
}
.plans .package-title {
    font-size: 30px;
    color: #ff6f43;
    top: 14px;
    position: absolute;
}
.plans .place-tag {
    background: #eee;
    padding: 5px;
    border-radius: 8px;
    text-align: center;
}
.plans .box-car img {
    width: 90px;
    padding: 0 0px 5px 0;
}
.plans p {
    padding-left: 15px;
    color: #5a5a5a;
    font-size: 15px;
}
.plans .card-details {
    padding: 20px;
    background: #fff;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border: 1px solid #dcdcdc;
}
.plans .plan-picture {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}
.plan-upperbar {
    background-size: cover !important;
    background-position: center !important;
}
.plan-upperbar .overlay {
    text-align: center;
    padding: 120px 0 172px 0;
    background: #00000099;
    color: #fff;
}
.plan-type a {
    text-decoration: none;
    background: #e5e5e5;
    color: #000;
    padding: 8px 25px;
    border-radius: 36px;
    margin: 15px;
    display: inline-block;
}
.plan-type .active {
    background: #000;
    color: #fff;
}
.plans {
    background: #f8f8f8;
}
.plans-buttons {
    margin-top: -107px;
    margin-bottom: 5px;
}
.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    font-weight: bold;
    color: #ff6f43;
}
.calendar-table {
    width: 100%;
    text-align: center;
}
.calendar-table th {
    background: #ddd;
    padding: 10px;
}
.calendar-table td {
    cursor: pointer;
    padding: 10px;
}
.calendar-header .selected {
    background-color: #ff6f43 !important;
    color: white;
}
.calendar-header .next-btn {
    display: block;
    width: 100px;
    margin: 20px auto;
    background-color: #ff6f43;
    color: white;
    padding: 10px;
    border: none;
    cursor: pointer;
}
.note {
    background: aliceblue;
    padding: 25px;
    border-radius: 10px;
}
.checkbox-option {
    width: 145px;
}
.payment-method {
    text-align: center
}
.payment-method img {
    width: 69px;
}
.payment-method .radio-item {
    border: 1px solid #ccc;
    border-radius: 10px;
    margin: 20px;
}
.paymeny-price {
    font-size: 20px
}
.method-options .box {
    border: 1px solid #C1AE73;
    padding: 10px;
    text-align: center;
    border-radius: 10px;
    font-size: 20px;
}
.visas-country ul {
    padding: 0;
}
.visas-country .card-body {
    padding: 20px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border: 1px solid #ccc
}
.visas-country img {
    height: 250px;
}
.umrah ul {
    padding: 0;
}
.umrah .card-body {
    padding: 20px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border: 1px solid #ccc
}
.umrah ul {
    padding: 5px;
    font-size: 18px;
}
.umrah .visa-header {
    background: #000;
    padding: 8px 10px;
    margin-bottom: 20px;
    color: #fff;
    text-align: center;
    border-radius: 10px;
    font-size: 18px;
}
.visas-upperbar {
    background-size: cover !important;
    background-position: center !important;
}
.visas-upperbar .overlay {
    padding: 100px 0 200px 0;
    background: #000000ad;
    color: #fff;
}
.footer {
    background: #000;
    padding: 40px 0;
    text-align: right
}
.footer h5 {
    color: #ff6f43;
    text-align: right
}
.footer a {
    color: white;
    text-decoration: none;
}
.footer a:hover {
    color: #ff6f43;
}
.social-icons a {
    font-size: 24px;
    margin: 0 10px;
    color: white;
}
.social-icons a:hover {
    color: #ff6f43;
}
.payment-icons img {
    height: 30px;
    margin: 14px;
}
.footer ul {
    padding-right: 0;
    text-align: right
}
.footer ul li {
    text-align: right;
    padding: 4px;
}
.footer ul li i {
    float: right;
    padding: 0 10px;
}
.footer h4 {
    text-align: right;
    color: #fff;
    margin-bottom: 20px;
}
.footer .FlexBox img {
    width: 75px;
    padding: 13px 14px 20px 15px;
}
.footer .FlexBox .img-phone {
    width: 55px;
    padding: 13px 14px 20px 15px;
}
.footer .FlexBox a {
    font-size: 22px;
    line-height: 26px;
    /*margin-top: 12px;*/
    display: inline-block;
}
.footer .FlexBox i {
    color: #fff;
    font-size: 25px;
    padding: 8px 12px;
}
.footer .social-icons {
    text-align: right
}
.upperbar-bg {
    background-size: cover !important;
    background-position: center !important;
}
.upperbar-bg .overlay {
    background: #0000009c;
    text-align: center;
    padding: 100px;
    color: #fff;
}
.join-hotel .card-white, .join-hotel .box-input label , .join-hotel .box-input input {
    background: #f8f8f8;
}
.join-hotel .card-white {
    margin-top: 7px;
    padding: 50px;
}
.join-hotel {
    margin-top: -100px;
}
.error {
    color: red;
    font-size: 14px;
    margin-top: 5px;
}
.success {
    color: green;
    font-size: 16px;
    background: #d4edda;
    padding: 10px;
    border-radius: 5px;
}
.carousel-indicators button {
    width: 23px !important;
    height: 20px !important;
    border-radius: 113px;
    display: inline-block;
}
.carousel-indicators .active {
    color: #ff6f43 !important;
}
.carousel-indicators [data-bs-target] {
    background-clip: unset;
}
.box-upload {
    border: 2px dashed #ff6f43;
    text-align: center;
    padding: 20px;
    border-radius: 15px;
}
.box-upload span {
    font-size: 15px;
    color: #888;
}
.card-gray {
    background: #F8F8F8;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 30px;
}
.payment-phone input {
    display: inline-block;
    width: auto;
    border-style: none !important;
    margin-bottom: 0;
    padding: 0 16px;
}
.payment-phone span {
    padding: 12px;
    color: #ff6f43;
    font-size: 35px;
    line-height: 20px;
}
.payment-phone label {
    color: #686868;
}
.upload-container p {
    font-size: 14px;
    color: #999;
}
.preview-image {
    max-width: 100%;
    height: auto;
    display: block;
    margin-top: 10px;
}
.delete-btn {
    margin-top: 5px;
    background-color: #dc3545;
    color: #fff;
    border: none;
    padding: 5px 10px;
    cursor: not-allowed;
    display: none;
}
input[type="file"]:disabled + .box-upload {
    pointer-events: none;
    opacity: 0.6;
}
.box-view-img {
    vertical-align: middle;
    width: 100%;
    height: 270px;
    padding: 20px;
    border: 2px dashed #ff6f43;
    border-radius: 20px;
    margin-top: 20px;
}
.cars .checkbox-option {
    width: 150px;
}
.large-screen {
    display: block !important;
}
.small-screen {
    display: none !important;
}
.owl-carousel button span {
    font-size: 45px;
    margin: 10px;
}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot {
    height: 20px;
}
.owl-theme .owl-nav {
    line-height: 20px;
    margin-top: 0;
}
@media (max-width: 575.98px) {
    .radio-container {
        display: block
    }
    .radio-item {
        display: flex
    }
    .radio-button {
        width: 25px;
        height: 24px;
    }
    .test-view .title-placement {
        font-size: 30px;
        line-height: 10px;
    }
    .header .overlay {
        padding: 53px 0 191px 0;
    }
    .header span {
        font-size: 22px;
    }
    .book-car .p-5 {
        padding: 1rem !important;
    }
    .cars .col {
        display: block;
    }
    .cars .checkbox-option {
        width: 115px;
    }
    .cars h5 {
        font-size: 16px;
        margin-bottom: 0;
    }
    .tab {
        padding: 5px 13px;
    }
    .home-searvice {
        padding: 25px 0;
    }
    .join-now .box strong {
        font-size: 19px;
        text-align: center;
        display: block;
    }
    .join-now .box a {
        display: block;
        border-radius: 43px;
        padding: 7px;
        font-size: 19px;
    }
    .form-icon input[type="datetime-local"] {
        margin-right: 0;
    }
    .btn-main-color {
        font-size: 16px;
        padding: 5px 24px;
    }
    .tab {
        padding: 8px 1px;
        font-size: 12px;
    }
    .cars .checkbox-option {
        width: 150px;
    }
    .cars h5 {
        font-size: 14px;
        margin-bottom: 0;
    }
    .swapCities {
        right: 168px;
    }
    .book-car h5 {
        font-size: 14px;
        margin-bottom: 0;
    }
    .footer h5 {
        color: #ff6f43;
        font-size: 25px;
        text-align: right;
        padding: 11px;
    }
    .footer h5 i {
        text-align: left;
        float: left;
        color: #fff;
    }
    .swapCities {
        transform: rotate(90deg);
    }
    .large-screen {
        display: none !important;
    }
    .small-screen {
        display: block !important;
    }
}
@media (min-width: 576px) and (max-width: 767.98px) {
    .header .overlay {
        padding: 53px 0 191px 0;
    }
    .header span {
        font-size: 22px;
    }
    .book-car .p-5 {
        padding: 1rem !important;
    }
    .radio-container {
        display: block
    }
    .radio-item {
        display: flex
    }
    .radio-button {
        width: 25px;
        height: 24px;
    }
    .test-view .title-placement {
        font-size: 30px;
        line-height: 10px;
    }
    .header .overlay {
        padding: 53px 0 191px 0;
    }
    .header span {
        font-size: 22px;
    }
    .book-car .p-5 {
        padding: 1rem !important;
    }
    .cars .col {
        display: block;
    }
    .cars .checkbox-option {
        width: 115px;
    }
    .cars h5 {
        font-size: 16px;
        margin-bottom: 0;
    }
    .tab {
        padding: 5px 13px;
    }
    .home-searvice {
        padding: 25px 0;
    }
    .join-now .box strong {
        font-size: 19px;
        text-align: center;
        display: block;
    }
    .join-now .box a {
        display: block;
        border-radius: 43px;
        padding: 7px;
        font-size: 19px;
    }
    .scroll-btn, .slider-indicators {
        display: block;
    }
    .form-icon input[type="datetime-local"] {
        margin-right: 0;
    }
    .swapCities {
        transform: rotate(90deg);
    }
    .large-screen {
        display: none !important;
    }
    .small-screen {
        display: block !important;
    }
}
@media (min-width: 768px) and (max-width: 991.98px) {
    .header .overlay {
        padding: 53px 0 191px 0;
    }
    .header span {
        font-size: 22px;
    }
    .book-car .p-5 {
        padding: 1rem !important;
    }
    .radio-container {
        display: block
    }
    .radio-item {
        display: flex
    }
    .radio-button {
        width: 25px;
        height: 24px;
    }
    .test-view .title-placement {
        font-size: 30px;
        line-height: 10px;
    }
    .header .overlay {
        padding: 53px 0 191px 0;
    }
    .header span {
        font-size: 22px;
    }
    .book-car .p-5 {
        padding: 1rem !important;
    }
    .cars .col {
        display: block;
    }
    .cars .checkbox-option {
        width: 115px;
    }
    .cars h5 {
        font-size: 16px;
        margin-bottom: 0;
    }
    .tab {
        padding: 5px 13px;
    }
    .home-searvice {
        padding: 25px 0;
    }
    .join-now .box strong {
        font-size: 19px;
        text-align: center;
        display: block;
    }
    .join-now .box a {
        display: block;
        border-radius: 43px;
        padding: 7px;
        font-size: 19px;
    }
    .form-icon input[type="datetime-local"] {
        margin-right: 0;
    }
    .large-screen {
        display: none !important;
    }
    .small-screen {
        display: block !important;
    }
}
@media (min-width: 992px) and (max-width: 1200px) {
    .cars .checkbox-option {
        width: 170px;
    }
}
.navbar .icon-navbar-login {
    background: #fff;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    text-align: center;
    font-size: 21px;
    padding: 8px;
    color: #000;
}
.navbar .other-toggler {
    font-size: 31px;
    margin-top: 8px;
}
.navbar-toggler {
    outline: none
}
.navbar .FlexBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.small-navbar .fa-whatsapp {
    font-size: 22px;
    color: #fff;
    padding: 10px;
}
.small-navbar {
    display: none !important
}
.tabs {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
}
.tab {
    position: relative;
    background: #F9F9F9;
    margin-left: -9px;
    display: flex;
    align-items: center;
    clip-path: polygon(15% 0%, 100% 0%, 86% 100%, 0% 100%);
    transition: background 0.3s;
    /*width: 126px;*/
    width: 142px;
}
.tab a {
    text-decoration: none;
    color: #333;
    font-weight: bold;
    display: flex;
    align-items: center;
    padding: 10px 20px;
}
.tab i {
    margin-left: 4px;
    font-size: 18px;
}
.tab.active {
    background: #ff6f43;
}
.tab.active a {
    color: white;
}
.small-footer {
    display: none;
}
.section_plans .single-city {
    color: #6F6F6F;
    background: #F2F2F2;
    margin: 2px 0;
    padding: 4px 8px;
    display: inline-block;
    border-radius: 6px;
}
.package-details {
    color: #818181;
}
.plan-picture {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
@media (max-width: 575.98px) {
    .navbar-brand, .old-toggler, .large-login {
        display: none;
    }
    .navbar .icon-navbar-login {
        width: 30px;
        height: 30px;
        font-size: 16px;
        padding: 5px;
    }
    .navbar ul {
        padding-right: 11px;
    }
    .navbar .nav-large-whatsapp {
        display: none;
    }
    .small-navbar {
        display: flex !important
    }
    .join-now .box strong {
        font-size: 16px;
        padding: 10px;
        text-align: center;
        display: block;
    }
    .join-now .box a {
        font-size: 20px !important;
        display: block;
        border-radius: 42px;
    }
    .large-footer {
        display: none;
    }
    .small-footer {
        display: block;
    }
    .left-section {
        height: auto !important;
        padding: 50px;
    }
    .login-form {
        margin-top: 1px;
    }
    .tab {
        width: 80px;
        font-size: 12px;
        text-align: center;
    }
    .tab a {
        padding: 0 10px
    }
    .tab i {
        font-size: 15px;
    }
    #cars .filter select {
        padding: 5px;
    }
    .upperbar-bg .overlay {
        padding: 35px;
    }
    .upperbar-bg .overlay h2 {
        font-size: 20px;
        margin-bottom: 30px;
    }
    .join-hotel .card-white {
        padding: 23px;
    }
    .box-input {
        padding: 3px 11px;
    }
    .box-input label {
        margin-top: -20px;
        padding: 0 10px;
        font-size: 16px;
    }
    .visas-upperbar .overlay {
        padding: 50px 30px 150px 30px !important;
        background: #000000ad;
        color: #fff;
    }
    .visas-upperbar .overlay h2 {
        font-size: 20px;
        margin-bottom: 30px;
    }
    .upperbar {
        padding: 36px 36px 80px 36px;
    }
    .calendar-container {
        width: 100%;
        padding: 0 !important;
    }
    .calendar-table th {
        padding: 4px;
        font-size: 13px;
    }
    .steps-container .p-5 {
        padding: 19px 0 !important;
    }
    .calendar-container .month-slider-item {
        margin: 0 0;
        font-size: 15px;
        padding: 6px;
    }
    .calendar-container .calendar-table td {
        height: 45px;
    }
    .box-upload {
        display: table;
        margin: auto;
    }
}

/**{*/
/*    font-family: 'Tajawal', sans-serif;*/
/*}*/
.accordion-button::after {
    display: none !important;
}
.d-flex {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
}
footer ul li {
    list-style: none;
}
.footer input, .footer textarea {
    color:#fff !important;
    background: none;
    border-bottom: 1px solid #fff !important;
    border-radius: 0;
    margin-bottom: 24px;
    outline: none;
    resize:none;
}
.footer input::placeholder, .footer textarea::placeholder{
    color:#fff !important;
}
.footer input:focus, .footer textarea:focus {
    color:#fff !important;
    background: none;
    border-bottom: 1px solid #fff !important;
    border-radius: 0;
    margin-bottom: 24px;
    outline: none !important;
}
.whatsapp-popup {
    position: fixed;
    bottom: 100px;
    right: 20px;
    width: 280px;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    z-index: 9999;
    display: none;
}
.popup-header {
    background-color:#ff6f43;
    padding: 12px;
    position: relative;
}
.close-btn {
    background: transparent;
    border: none;
    font-size: 18px;
    color: #fff;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 8px;
    line-height: 1;
}
.popup-body {
    padding: 12px;
    color: #333;
    text-align: right;
}
.floating-whatsapp {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    z-index: 10000;
}
.floating-whatsapp img {
    width: 100%;
    height: auto;
    display: block;
}
.img-fluid{
    max-width:300px !important;
}
.swiper-pagination-bullet{
    background: #ff6f43 !important;
}
.cars-slider-wrapper {
    position: relative;
    overflow: hidden;
}
.cars-slider {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
}
.car-card-wrapper {
    flex: 0 0 80%;
    scroll-snap-align: start;
}
@media (min-width: 768px) {
    .car-card-wrapper {
        flex: 0 0 40%;
    }
}
@media (min-width: 1200px) {
    .car-card-wrapper {
        flex: 0 0 25%;
    }
}
.cars-pagination {
    display: flex;
    justify-content: center;
    margin-top: 10px;
    gap: 6px;
}
.cars-pagination .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #ccc;
    cursor: pointer;
    transition: background 0.3s;
}
.cars-pagination .dot.active {
    background: #ff6f43;
}
.first_tab{
    clip-path: polygon(15% 0%, 100% 0, 100% 100%, 0% 100%) ;
}
th{
    white-space:nowrap;
}
.footer_icon{
    margin-left:10px;
    margin-right:0;
}
.why_icon{
    margin-right:14px;
    margin-left:0;
}
html[dir="ltr"] .navbar-nav {
    margin-left: auto;
    margin-right: 0;
}
html[dir="ltr"] .tab{
    clip-path: polygon(0 0, 85% 0, 100% 100%, 14% 100%);
}
html[dir="ltr"] .first_tab{
    clip-path: polygon(0 0, 85% 0, 100% 100%, 0% 100%);
}
html[dir="ltr"] .footer_icon{
    margin-right:10px;
    margin-left:0;
}
html[dir="ltr"] .why_icon{
    margin-left:14px;
    margin-right:0;
}
html[dir="ltr"] .zeft_title{
    text-align:left;
}
html[dir="ltr"] .plans p{
    padding-right:15px;
    padding-left:0;
}
html[dir="ltr"] .form-icon label {
    left: 39px;
    right: auto;
}
html[dir="rtl"] .form-icon label {
    right: 39px;
    left: auto;
}
html[dir="ltr"] .box-input label {
    left: 270px;
    right: auto;
}
.input-group {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #fff;
}
html[dir="ltr"] .dropdown-menu-end[data-bs-popper] {
    right: auto !important;
    left: 0 !important;
}
html[dir="ltr"] .btn.next {
    margin-right: 0;
    margin-left: 20px;
}
html[dir="ltr"] .tabs {
    padding-left: 8px;
}
html[dir="ltr"] .tab i{
    margin-left: 0;
    margin-right: 4px;
}
#togglePassword{
    cursor: pointer;
    padding:0 0 0 40px;
}
html[dir="ltr"] #togglePassword{
    cursor: pointer;
    padding:0 40px 0 0;
}
.input-light-icon svg{
    margin-right:10px;
}
.reset-btn{
    margin-right:2px
}
html[dir="ltr"] .input-light-icon svg{
    margin-right:0;
    margin-left:10px;
}
html[dir="ltr"] .reset-btn{
    margin-right:0;
    margin-left:2px;
}
@media (max-width: 768px) {
    .hero-text-wrapper {
        text-align: center !important;
    }
}