 
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');

body {
font-family: "Plus Jakarta Sans", sans-serif;
  background-color: #f9fafc;
}
p, a, label, span, li {
font-family: "Plus Jakarta Sans", sans-serif;
font-weight: 500;
}
.container{max-width: 1260px;}
/* Banner */
.banner-section {
  background: linear-gradient(139deg, #312e81 0%, #581c87 82%);
  color: #fff;
  text-align: left;
  padding: 20px 0 140px;
  position: relative;
}

.banner-section h1 {
  font-weight: 700;
  font-size: 54px;
}
.banner-section p {
  max-width: 600px;
  font-size: 16px;
  margin-top: 15px;
  line-height: 1.6;
}
.select-pick .form-group {
margin-bottom: 3px;
}
.passanger-luggage-main {
margin: 10px 0px;
}
.flight-timing-main {
margin: 10px 0px;
}
form.booking-form.passanger-details label {
font-size: 14px;
}
.passanger-details button.btn.btn-gradient.btn-block {
margin-top: 25px;
}
/*    .banner-section .auth-buttons {
  position: absolute;
  top: 30px;
  right: 60px;
}*/
.auth-buttons a {
  color: #fff;
  font-weight: 600;
  margin-left: 15px;
}
img.people-lu {
width: 25px !important;
}
.auth-buttons .btn-primary {
  background: linear-gradient(90deg, #009cff, #007bff);
  border: none;
  padding: 5px 15px;
  border-radius: 6px;
}
.auth-buttons .btn-primary:hover {
  background: linear-gradient(90deg, #0261e8, #008cfb);
}
span.apply-coupon-btn {
cursor: pointer;
}
/* Form Section */
.row.journey-form-area {
background: #fff;
border-radius: 10px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.journey-wrapper {
  position: relative;
  margin-top: -100px;
}
.journey-card {
  background: #fff;
  border-radius: 10px;
  /*box-shadow: 0 4px 12px rgba(0,0,0,0.08);*/
  padding: 10px;
}
.tab-section .nav-tabs {
  border-bottom: none;
}
.tab-section .nav-link {
  border: none;
  background: #f0f4ff;
  border-radius: 8px 8px 0px 0px;
  margin-right: 10px;
  color: #000;
  padding: 10px 30px;
  font-weight: 600;
}
.tab-section .nav-link.active {
  background: #312e81;
  color: #fff;
}
.booking-form label {
/* font-weight: 600; */
font-size: 18px;
font-weight: 500 !important;
line-height: 20px;
}
.booking-form .form-control {
  border-radius: 6px;
  height: 42px;
  font-size: 14px;
}
.nav-area {
display: flex;
justify-content: space-between;
padding-bottom: 60px;
}
.logo a {
color: #fff;
font-size: 24px;
font-weight: bold;
font-style: italic;
}
.passanger-row button.btn.btn-sm.btn-light {
background: #EFF3F7;
font-size: 20px;
font-weight: bold;
color: #64748B;
border-radius: 60px;
padding: 5px 15px;
}
.booking-form h6 {
font-size: 18px;
font-weight: 500;
}
.passanger-row span {
font-size: 20px;
font-weight: 600;
color: #64748B;
}
div#journeyTabsContent {
border: 1px solid #2369EA;
padding: 20px;
margin-top: 1px !important;
border-radius: 0px 6px 6px 6px;
}
.route-item img {
width: 16px;
position: relative;
bottom: 3px;
}
.tab-section h5.mb-3 {
padding: 20px 0px;
font-size: 24px;
font-weight: 500;
}
.via-btn {
  background: #312e81;
  color: #fff;
  border: none;
  padding: 5px 15px;
  border-radius: 20px;
  font-size: 13px;
}
.continue-btn {
  background: linear-gradient(90deg, #008cfb, #0261e8);
  color: #fff;
  font-weight: 600;
  border-radius: 6px;
  border: none;
  height: 48px;
  width: 100%;
  margin-top: 15px;
}
.continue-btn:hover {
 background: linear-gradient(90deg, #0261e8, #008cfb);
}
/* Right Section */
.journey-summary {
  background: #fff;
  border-radius: 10px;
  /*box-shadow: 0 4px 12px rgba(0,0,0,0.08);*/
  padding: 25px;
}
.journey-summary img {
width: 100%;
margin-bottom: 20px;
}
.journey-summary h5 {
  font-weight: 700;
  margin-bottom: 23px;
  font-size: 28px;
}
.departure .summary-item {
margin-bottom: 20px;
}
.journey-summary .summary-item img {
width: 20px;
margin-bottom: 0;
height: 20px;
margin-right: 10px;
}
.summary-main .summary-item {
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #eee;
padding: 6px 0px;
}
.summary-item {
  display: flex;
  font-size: 14px;
  margin-bottom: 8px;
}
.summary-item i {
  color: #007bff;
  margin-right: 8px;
}
.summary-card {
  border: 1px solid #e3e6ef;
  border-radius: 6px;
  padding: 10px;
  font-size: 13px;
  margin-top: 5px;
  text-align: center;
}
    /* Section */
.available-vehicles {
  padding: 60px 0;
}
.available-vehicles h3 {
  font-weight: 600;
  font-size: 32px;
  margin-bottom: 30px;
}
.total-fare h3 {
font-size: 24px;
}
/* Vehicle Card */
.vehicle-card {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  padding: 20px 25px;
  display: flex;
  align-items: center;
  position: relative;
  transition: all 0.3s ease;
}
.vehicle-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.1);
}

.vehicle-img {
  flex: 0 0 200px;
}
.vehicle-img img {
  width: 100%;
  border-radius: 8px;
}

.vehicle-details {
  flex: 1;
  padding-left: 25px;
}

.vehicle-title {
font-weight: 600;
font-size: 26px;
color: #222;
margin-bottom: 3px;
}
.vehicle-sub {
  color: #6c757d;
  font-size: 14px;
  margin-bottom: 10px;
}

.vehicle-specs {
display: flex;
align-items: center;
font-size: 14px;
color: #555;
margin-bottom: 0;
margin-top: 20px;
}
.departure .summary-item img {
width: 18px;
margin-right: 10px;
}
.date-slot .summary-card img {
width: 14px;
margin-bottom: 0;
margin-right: 5px;
}
.select-vehicle {
text-align: right;
}
.select-pick {
display: flex;
justify-content: space-between;
text-transform: uppercase;
font-weight: 500;
}
.vehicle-specs i {
  color: #007bff;
  margin-right: 6px;
}
.vehicle-specs span {
margin-right: 6px;
display: flex;
align-items: center;
color: #64748B;
}
/*.available-vehicles .col-md-6.mb-4 {
padding: 0;
}*/
button.select-btn.unselect {
background: #A7A7A7;
}
.vehicle-pricing {
display: flex;
align-items: center;
font-size: 14px;
font-weight: 600;
margin: 20px 0px;
margin-bottom: 0;
}
.vehicle-pricing span {
margin-right: 15px;
color: #333;
font-size: 13px;
}
.vehicle-pricing span b {
color: #0B2A6F;
margin-left: 5px;
display: block;
}
.form-group.via-location {
display: flex;
justify-content: space-between;
margin-bottom: 5px;
}
.select-btn {
  background: linear-gradient(90deg, #008cfb, #0261e8);
  border: none;
  color: #fff;
  border-radius: 25px;
  font-weight: 600;
  font-size: 14px;
  padding: 7px 22px;
  /*position: absolute;*/
  right: 25px;
  bottom: 25px;
  transition: background 0.3s ease;
  display: flex;
gap: 5px;
float: right;
}
    .select-btn:hover {
 background: linear-gradient(90deg, #0261e8, #008cfb) !important;
}
.btn:hover {
color: #fff;
text-decoration: none;
}
.select-btn:hover {
  background: linear-gradient(90deg, #0056d2, #007bff);
}

.select-btn.disabled {
  background: #c5c5c5;
  cursor: not-allowed;
}

.discount-badge {
  position: absolute;
  top: 0;
  right: 0;
  background: #ffcc00;
  color: #000;
  font-weight: 700;
  font-size: 13px;
  padding: 5px 10px;
  border-bottom-left-radius: 8px;
}
.booking-section {
padding-top: 60px;
padding-bottom: 60px;
}

.booking-title {
font-weight: 700;
color: #111;
}

.booking-subtitle {
color: #6c757d;
}

.booking-card {
background: #fff;
border: none;
border-radius: 12px;
box-shadow: 0 1px 6px rgba(0, 0, 0, 0.08);
padding: 30px;
margin-bottom: 30px;
min-height: 460px;
}

.extra-item {
background: #F5F7F9;
border-radius: 10px;
padding: 24px 20px;
margin-bottom: 15px;
}

.extra-icon img {
width: 40px;
height: 40px;
}

.alert-info {
background-color: #e7f5fb;
border: none;
color: #444;
border-radius: 10px;
font-size: 14px;
border: 1px solid #C8F0FF;
}

.form-control {
height: 46px;
border-radius: 8px;
border: 1px solid #ddd;
font-size: 14px;
}

.form-control:focus {
border-color: #4fa1f3;
box-shadow: none;
}

/* Toggle Switch */
.switch {
position: relative;
display: inline-block;
width: 46px;
height: 26px;
}

.switch input {
opacity: 0;
width: 0;
height: 0;
}

.slider {
position: absolute;
cursor: pointer;
background-color: #ccc;
transition: .4s;
border-radius: 34px;
top: 0;
left: 0;
right: 0;
bottom: 0;
}

.slider:before {
position: absolute;
content: "";
height: 18px;
width: 18px;
left: 4px;
bottom: 4px;
background-color: white;
transition: .4s;
border-radius: 50%;
}

input:checked + .slider {
background-color: #4fa1f3;
}

input:checked + .slider:before {
transform: translateX(20px);
}
.counter-btn {
width: auto;
height: auto;
border-radius: 50%;
border: none;
background-color: #f1f4f8;
color: #4a4a4a;
font-size: 19px;
font-weight: 500;
cursor: pointer;
transition: 0.2s;
padding-top: 3px;
padding-bottom: 9px;
padding-left: 15px;
padding-right: 15px;
}

.counter-btn:hover {
  background-color: #e2e6eb;
}

.counter-value {
  font-size: 16px;
  font-weight: 500;
  color: #333;
  margin: 0 10px;
  width: 24px;
  text-align: center;
}

.counter-label {
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 6px;
  color: #333;
}
/* Gradient Button */
.btn-gradient {
background: linear-gradient(90deg, #008cfb, #0261e8);
border: none;
border-radius: 6px;
color: #fff;
font-weight: 500;
font-size: 15px;
padding: 12px 20px;
transition: 0.3s ease;
width: auto;
float: right;
}
.btn-gradient:hover {
background: linear-gradient(90deg, #0261e8, #008cfb );
}
section.booking-section.py-5 {
padding-top: 0 !important;
}

.btn-gradient:hover {
opacity: 0.9;
}
.extra-icon span {
background: #DDEFF7;
padding: 17px 14px;
border-radius: 6px;
}
.extra-info h6.mb-1 {
font-size: 16px;
font-weight: 600;
}
/* Feature Section */
.features-section {
position: relative;
padding: 60px 0;
background: url('../images/City-Building.png');
background-repeat: no-repeat;
padding-bottom: 100px !important;
}

.feature-box {
background: linear-gradient(178deg,rgba(255, 255, 255, 1) 23%, rgba(244, 248, 253, 1) 100%);
border: 1px solid #d9d9d9;
border-radius: 12px;
text-align: center;
padding: 40px 20px;
transition: 0.3s ease;
height: 100%;
}

.feature-box.active {
background: linear-gradient(139deg, #312e81 0%, #581c87 82%);
color: #fff;
border: none;
}

.feature-box img {
width: 50px;
height: 50px;
}

.feature-box.active img {
filter: brightness(0) invert(1);
}

.feature-box p {
font-size: 18px;
color: #000;
font-weight: 600 !important;
line-height: 24px;
}

.feature-box.active p {
color: #fff;
}

.chat-buttons {
position: absolute;
right: 0;
/* top: 50%; */
/* transform: translateY(-50%); */
/* display: flex; */
/* flex-direction: column; */
gap: 15px;
bottom: 130px;
}

.chat-btn {
display: flex;
align-items: center;
gap: 10px;
background: linear-gradient(90deg, #008cfb, #0261e8);
color: #fff;
padding: 15px 43px;
border-radius: 30px 0px 0px 30px;
text-decoration: none;
font-weight: 500;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
transition: 0.3s;
margin-bottom: 10px;
color: #fff !important;
text-decoration: none !important;
}

.chat-btn:hover {
opacity: 0.9;
text-decoration: none;
color: #fff;
}

.chat-btn img {
width: 20px;
height: 20px;
}

/* Footer */
.footer-section {
background: linear-gradient(to right, #122146 0%, #1c3d82 100%) !important;
color: #fff;
padding: 30px 0;
font-size: 15px;
position: relative;
}

.footer-section a {
color: #4fa1f3;
text-decoration: underline;
}

.footer-section a:hover {
color: #fff;
}
.return-journey input#landingDateTime {
width: 100%;
border: 1px solid #ccc;
padding: 10px;
border-radius: 6px;
}
.return-journey textarea#notes {
width: 100%;
border: 1px solid #ccc;
padding: 10px;
border-radius: 6px;
}
.return-journey .form-group.half {
width: 49%;
}
.return-journey input#flightNumber {
width: 100%;
border: 1px solid #ccc;
padding: 10px;
border-radius: 6px;
}
.return-journey .form-row.flight-number {
gap: 10px;
}
.return-journey select#pickupDelay {
width: 100%;
padding: 10px;
border: 1px solid #ccc;
border-radius: 6px;
}
.hourly-card button#calcPrice {
width: 100%;
background: linear-gradient(90deg, #008cfb, #0261e8);
color: #fff;
border: navajowhite;
padding: 13px;
border-radius: 6px;
}
.hourly-card button#calcPrice:hover {
background: linear-gradient(90deg, #0261e8, #008cfb);
}
/* Coupon Modal Styling */
.coupon-modal {
border-radius: 10px;
overflow: hidden;
font-family: "Plus Jakarta Sans", sans-serif;
}

.coupon-modal .modal-header {
padding: 1rem 1.5rem;
}

.coupon-modal .modal-body {
padding: 1.5rem;
max-height: 70vh;
overflow-y: auto;
}

.coupon-modal .coupon-input-wrapper {
border: 1px solid #ddd;
border-radius: 6px;
overflow: hidden;
}

.coupon-modal .coupon-input {
border: none;
box-shadow: none;
}

.coupon-modal .check-btn {
border-left: none;
font-weight: 600;
color: #007bff !important;
background: #fff;
}
a.text-danger.small{
 color: #007bff !important; 
}
.modal-footer button.btn.btn-danger.px-4 {
background: linear-gradient(90deg, #008cfb, #0261e8);
border: none;
}
.modal-footer button.btn.btn-danger.px-4:hover {
 background: linear-gradient(90deg, #0261e8, #008cfb);
}
.coupon-modal .coupon-section {
background: #fafafa;
padding: 1rem;
border-radius: 6px;
border: 1px solid #eee;
}

.coupon-modal .coupon-item {
border-bottom: 1px dashed #ddd;
padding-bottom: 0.75rem;
margin-bottom: 0.75rem;
}

.coupon-modal .coupon-item:last-child {
border-bottom: none;
margin-bottom: 0;
}

.coupon-modal .coupon-code {
display: inline-block;
border: 1px dashed #999;
border-radius: 4px;
padding: 3px 8px;
font-weight: 600;
font-size: 13px;
margin-bottom: 5px;
}

.coupon-modal .coupon-details {
font-size: 13px;
color: #444;
line-height: 1.4;
}

.coupon-modal .modal-footer {
background: #fff;
border-top: 1px solid #eee;
padding: 1rem 1.5rem;
}

.apply-coupon-btn {
cursor: pointer;
text-decoration: underline;
}

.apply-coupon-btn:hover {
color: #c2185b;
}
.custom-select {
position: relative;
appearance: none;          /* Hide default arrow */
-webkit-appearance: none;
-moz-appearance: none;
background-color: #fff;
/*background-image: url("data:image/svg+xml;utf8,<svg fill='%23666' height='10' viewBox='0 0 20 20' width='10'><path d='M5.516 7.547l4.484 4.484 4.484-4.484 1.516 1.516-6 6-6-6z'/></svg>");*/
background-repeat: no-repeat;
background-position: right 15px center; /* ðŸ‘ˆ move arrow 15px left */
background-size: 10px;
border: 1px solid #ccc;
border-radius: 6px;
padding: 8px 40px 8px 12px; /* add right padding for arrow space */
font-size: 14px;
color: #333;
width: 100%;
}
/* Responsive */
@media (max-width: 991px) {
.chat-buttons {
/*position: static;*/
transform: none;
flex-direction: row;
justify-content: center;
margin-top: 30px;
}
}

/* General Box */
.row.booking-confirmation .summary-box {
background: #FAFBFD;
border: 1px solid #e3e6ea;
border-radius: 10px;
padding: 25px 20px;
}

.journey-id {
background: #007bff;
color: #fff;
font-size: 13px;
border-radius: 20px;
padding: 6px 12px;
}

.route-item h6 {
font-size: 18px;
font-weight: 500;
color: #64748B;
}

.route-item p {
font-size: 14px;
margin-bottom: 0;
color: #555;
}

.journey-info .label {
color: #777;
font-size: 15px;
margin-bottom: 0px;
}
.col img {
width: 17px;
position: relative;
bottom: 2px;
}
#oneway h6 span img {
width: 17px;
margin-right: 5px;
}
.summary-box.mb-4.passangers-details {
margin-top: 20px;
}
.journey-info .value {
font-weight: 600;
font-size: 14px;
color: #1a1a1a;
}

/* Fare Breakdown */
.fare-table {
font-size: 14px;
color: #333;
line-height: 1.8;
}

.fare-subtotal {
border-top: 1px solid #e3e6ea;
padding-top: 5px;
}

.fare-total {
border-top: 1px solid #ccc;
margin-top: 15px;
padding-top: 10px;
}

.info-box {
background: #f1f8ff !important;
border: 1px solid #cce3ff !important;
}
section.booking-summary.py-5 {
margin-top: -100px;
position: relative;
padding-top: 0 !important;
}
.row.booking-confirmation {
background: #fff;
padding: 10px;
padding-top: 23px;
border-radius: 10px;
padding-bottom: 30px;
}
.info-box p {
font-size: 14px;
color: #333;
}

/* Passenger Details */
.icon-circle {
width: 46px;
height: 46px;
background: linear-gradient(90deg, #008cfb, #0261e8);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}

.icon-circle img {
width: 25px;
height: 25px;
}

/* Payment Tabs */
.payment-tabs .btn {
flex: 1;
border: 1px solid #e3e6ea;
background: #fff;
font-weight: 500;
border-radius: 6px;
}

.payment-tabs .btn.active {
background: #fff;
color: #333;
border: 1px solid #007bff;
}
.journey-route {
border-bottom: 1px solid #e3e3e3;
padding-bottom: 25px;
}
.sidebar .passangers-details h6 {
margin-bottom: 20px !important;
}
.payment-tabs .btn + .btn {
margin-left: 10px;
padding: 20px 0px;
}
.sidebar p.text-muted.small.mb-3 {
font-size: 16px;
color: #64748B !important;
}
/* Payment Inputs */
.form-control {
border: 1px solid #dcdfe3;
border-radius: 6px;
height: 40px;
font-size: 14px;
}

.form-control:focus {
border-color: #007bff;
box-shadow: none;
}

/* Pay Button */
.pay-btn {
background: linear-gradient(90deg, #008cfb, #0261e8);
border: none;
padding: 12px 0;
font-weight: 600;
border-radius: 6px;
margin-bottom: 20px;
}
.pay-btn:hover {
background: linear-gradient(90deg, #0261e8, #008cfb);
}
.journey-info .col {
width: 25% !important;
flex-basis: auto;
text-align: left;
display: flex;
gap: 7px;
}
.fare-break h2 {
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
}
.sidebar h6 {
font-size: 20px;
margin-bottom: 0 !important;
}
.form-group.mobile {
display: none;
}
.via-feature p {
font-style: italic;
font-size: 13px;
}
.alert-info {
margin-top: 0 !important;
}
.vehicle-specs img {
width: 17px;
}
.via-field-wrapper {
background: #fff;
border: 1px solid #e5e8ec;
border-radius: 8px;
padding: 0;
display: flex;
align-items: center;
box-shadow: 0 1px 2px rgba(0,0,0,0.02);
max-width: 700px;
margin-bottom: 20px;
}
div#returnSection {
display: block;
}
.via-input {
  flex: 1;
  border: none;
  outline: none;
  height: 42px;
  font-size: 14px;
  color: #333;
  padding-left: 10px;
  background: transparent;
}

.via-input::placeholder {
  color: #a0a6b0;
}

.via-remove {
border: none;
background: transparent;
color: #c7ccd3;
font-size: 20px;
font-weight: 400;
cursor: pointer;
transition: 0.2s;
position: absolute;
right: 50px;
}

.via-remove:hover {
  color: #ff4d4f;
}
.return-section {
display: none;
border: none;
border-radius: 6px;
padding: 0px;
margin-top: 2px !important;
background: #fff;
}

.form-group label {
  font-weight: 600;
  font-size: 13px;
  color: #333;
  /*text-transform: uppercase;*/
}

.form-control {
  font-size: 14px;
  height: 42px;
  border-radius: 4px;
}

.icon-wrapper {
  position: relative;
}

.icon-wrapper i {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: #666;
}

.icon-wrapper input,
.icon-wrapper select {
  padding-left: 12px;
}

.add-notes {
  text-align: center;
  color: #009688;
  font-weight: 600;
  cursor: pointer;
  margin: 8px 0 15px;
}

.add-notes:hover {
  text-decoration: underline;
}

.required {
  color: red;
}

.return-checkbox {
  margin-top: 10px;
}
/* Responsive */


@media (max-width: 991px) {
.journey-info .col {
margin-bottom: 15px;
}
}
@media screen and (min-width: 1301px) and (max-width: 1500px) {
.container {
max-width: 1170px;
}
.vehicle-img {
flex: 0 0 150px;
}
.booking-card {
min-height: 470px;
}
.summary-card {
font-size: 12px;
}
.journey-summary {
padding-left: 0;
}
} 

@media screen and (min-width: 1025px) and (max-width: 1300px) { 
.banner-section {
padding: 20px 20px 140px !important;
}
.row.booking-confirmation {
margin: 0;
}
.banner-section p {
margin-top: 0;
} 
.booking-form label {
font-size: 12px;
}
.return-checkbox label.form-check-label.font-weight-bold {
font-size: 18px;
}
.journey-summary {
padding-left: 0;
}
.date-slot .col-6 {
padding: 4px;
}
.vehicle-card {
padding: 20px 10px;
}
.summary-card {
padding: 6px;
}
.vehicle-img {
flex: 0 0 150px;
}
.vehicle-details {
padding-left: 5px;
}
.vehicle-specs span {
margin-right: 6px;
font-size: 13px;
}
.btn-gradient {
margin-top: 20px;
}
.alert-info {
margin-top: 0 !important;
}
.booking-card {
padding: 15px;
}
.features-section {
padding-top: 0 !important;
}
.feature-box p {
font-size: 20px;
line-height: 24px;
}
.row.journey-form-area {
margin: 0;
}
.booking-card {
min-height: 460px;
}
}
@media screen and (min-width: 768px) and (max-width: 1024px) { 
.sidebar {
margin-top: 22px;
}
.banner-section h1 {
font-size: 42px;
}
.row.booking-confirmation {
margin: 0;
}
.vehicle-card {
display: block;
}
.vehicle-details {
padding-left: 0px;
}
.vehicle-specs span {
margin-right: 8px;
font-size: 12px;
}
.select-btn {
position: absolute;
right: 25px;
bottom: 19px;
}
.booking-section .row {
display: block !important;
}
.booking-section .col-md-6 {
max-width: 100%;
}
.features-section {
padding-top: 0 !important;
}
.feature-box p {
font-size: 16px;
line-height: 22px;
}
.feature-box {
padding: 20px 6px;
}
.available-vehicles {
padding: 60px 0;
padding-bottom: 0;
}
.journey-summary {
padding: 25px 0px;
}
.journey-summary h5 {
font-size: 20px;
}
.row.journey-form-area .col-md-4 {
max-width: 100%;
}
.row.journey-form-area .col-md-8 {
max-width: 100%;
}
.row.journey-form-area {
display: block;
}
.row.journey-form-area {
margin: 0;
}
.journey-summary .map {
width: 100%;
margin-bottom: 20px;
height: 250px;
object-fit: cover;
border-radius: 10px;
}
}
@media screen and (min-width: 992px) and (max-width: 1024px) {
.sidebar {
margin-top: 0;
}
.banner-section {
padding: 20px 20px 140px !important;
}
}
@media screen and (min-width: 768px) and (max-width: 991px) {
.banner-section {
padding: 20px 20px 140px !important;
}   

}
@media (max-width: 767px) {
.banner-section h1 {
font-size: 28px;
}
.banner-section {
padding: 20px 20px 140px;
}
.banner-section p {
font-size: 14px;
}
.banner-section p {
text-align: center;
width: 100%;
max-width: 100%;
}
.banner-section h1 {
text-align: center;
}
#oneway .mr-3 {
margin-right: 8px !important;
}
#oneway .form-group {
margin-bottom: 10px;
}
.available-vehicles h3 {
font-weight: 600;
font-size: 20px;
margin-bottom: 20px;
}
.available-vehicles {
padding: 40px 0;
}
.booking-title {
font-size: 24px;
}
.booking-form h6 {
font-size: 16px;
}
.booking-subtitle {
margin-bottom: 20px !important;
}
.available-vehicles h3 {
text-align: left !important;
}
.booking-title {
text-align: left !important;
}
.journey-card {
padding: 0;
}
.booking-subtitle {
text-align: left !important;
}
.banner-section p {
margin-top: 0;
}
.tab-section .nav-link {
margin-right: 3px;
padding: 10px 21px;
}
div#journeyTabsContent {
padding: 12px;
}
.journey-summary {
padding: 0px;
margin-top: 20px;
}
.summary-card {
padding: 8px;
}
.vehicle-card {
padding: 20px 15px;
display: block;
}
.form-group.desktop {
display: none;
}
.form-group.mobile {
text-transform: uppercase;
font-weight: 500;
}
.booking-form label {
font-size: 13px;
}
.vehicle-img {
text-align: left;
}
.vehicle-img img {
width: 200px;
}
.vehicle-details {
padding-left: 0;
}
.vehicle-specs span {
margin-right: 5px;
font-size: 12px;
}
.select-btn {
position: absolute;
bottom: 18px;
}
.booking-card {
padding: 30px 15px;
}
.btn-gradient {
float: none;
margin-top: 20px;
}
section.booking-section.py-5 {
padding-bottom: 0 !important;
}
.extra-item {
background: #f9fbfc;
border-radius: 10px;
padding: 14px 10px;
margin-bottom: 15px;
}
.extra-info.ml-3 {
line-height: 18px;
}
.via-feature p {
font-size: 10px;
}
.via-btn {
width: 80px;
}
.vehicle-title {
font-size: 20px;
}
.row.journey-form-area {
margin: 0px;
}
.banner-section h1 {
font-size: 28px;
}
.row.booking-confirmation {
background: #fff;
padding: 0;
margin: 0px;
padding-top: 15px;
}
.journey-route {
display: block !important;
}
.journey-info .col {
width: 50% !important;
padding-right: 0;
}
.sidebar {
margin-top: 20px;
}
.row.booking-confirmation .summary-box {
padding: 25px 15px;
}
.route-arrow.mx-3 {
margin: 20px 0px;
}
.form-group.mobile {
display: block;
}
}
@media screen and (min-width:501px) and (max-width: 767px) {
.form-group.col-md-4 {
width: 33%;
} 
.return-checkbox label.form-check-label.font-weight-bold {
font-size: 18px;
}
}
@media screen and (min-width:680px) and (max-width: 767px) {
.available-vehicles .col-md-6.mb-4 {
width: 50%;
}
}
@media screen and (min-width:576px) and (max-width: 680px) {
.vehicle-card {
display: flex;
}
}
@media (max-width: 575px) {
.return-journey .form-group.half {
width: 100%;
}
.vehicle-img img {
width: 150px;
}
.vehicle-img {
text-align: center;
}
.vehicle-title {
text-align: center;
}
.vehicle-sub {
text-align: center;
}
.vehicle-specs {
justify-content: center;
}
.booking-form label {
margin-bottom: 0;
}
.via-remove {
right: 25px;
}
.return-checkbox label.form-check-label.font-weight-bold {
font-size: 18px;
}
}
@media (max-width: 500px) {
.form-group.col-md-4 {
width: 50%;
}  
.booking-form label {
font-size: 12px;
}
}