@charset "UTF-8";
@font-face {
  font-family: "product_sans_blackregular";
  src: url("../fonts/productsans/productsans-black-webfont.woff2") format("woff2");
  src: url("../fonts/productsans/productsans-black-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "product_sansbold";
  src: url("../fonts/productsans/productsans-bold-webfont.woff2") format("woff2");
  src: url("../fonts/productsans/productsans-bold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "product_sans_lightregular";
  src: url("../fonts/productsans/productsans-light-webfont.woff2") format("woff2");
  src: url("../fonts/productsans/productsans-light-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "product_sans_mediumregular";
  src: url("../fonts/productsans/productsans-medium-webfont.woff2") format("woff2");
  src: url("../fonts/productsans/productsans-medium-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "product_sans";
  src: url("../fonts/productsans/productsans-regular-webfont.woff2") format("woff2");
  src: url("../fonts/productsans/productsans-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "product_sans_thinregular";
  src: url("../fonts/productsans/productsans-thin-webfont.woff2") format("woff2");
  src: url("../fonts/productsans/productsans-thin-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "SFProDisplay";
  src: url("../fonts/sf-pro/SFProDisplay-Ultralight.woff2") format("woff2");
  src: url("../fonts/sf-pro/SFProDisplay-Ultralight.woff") format("woff");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
body {
  font-family: "product_sans", Arial, sans-serif !important;
  font-style: normal !important;
  font-weight: normal !important;

}

p {
  font-family: "product_sans", Arial, sans-serif !important;
}

.link-container {
  color: #000;
  width: 100%;
  display: flex;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 30px;
  border-radius: 8px;
}
.link-container p {
  margin-bottom: 0;
}
.link-container img {
  margin-right: 18px;
}
.link-container.active {
  background-image: linear-gradient(to left, #3574C0, #194F90);
  color: white;
}
.link-container.active:hover {
  color: white;
}

a:hover {
  color: #000;
}

.aside {
  display: block;
  position: absolute;
  right: 0;
  height: 100vh;
  width: 450px;
  border: 1px solid #d5d5d5;
}

.aside-header {
  height: 60px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 25px;
  border-bottom: 1px solid #d5d5d5;
}

.aside-header p {
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 0;
}

.aside-header a {
  color: #8CA7C7;
  text-decoration: none;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: transparent;
  color: royalblue !important;
  position: relative;
}

.nav-pills .nav-link.active::after {
  content: "";
  height: 100%;
  width: 4px;
  background-color: royalblue;
  position: absolute;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  top: 0;
  left: 0;
}

.nav-pills .nav-link {
  /* border-bottom: 1px solid #d5d5d5 */
  border: 1px solid #d5d5d5;
}

.checkbox {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}
.checkbox .checkbox__input {
  display: none;
}
.checkbox .checkbox__input:checked + .checkbox__box {
  background-color: #2266dc;
  border-color: #2266dc;
}
.checkbox .checkbox__input:checked + .checkbox__box::after {
  transform: scale(1);
}
.checkbox .checkbox__box {
  width: 1.25em;
  height: 1.25em;
  border: 2px solid #cccccc;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-right: 10px;
  transition: background 0.15s, border-color 0.15s;
}
.checkbox .checkbox__box::after {
  content: "✔";
  color: #ffffff;
  transform: scale(0);
  transition: transform 0.15s;
}

.btn-primary {
  background-image: linear-gradient(to left, #3574C0, #194F90);
  color: white;
  border-radius: 6px;
  padding: 13px 48px;
	border: none;
  margin-bottom: 16px;
}

.btn-outline-primary {
  padding: 13px 48px;
}

.invoice-footer {
  border-top: 1px solid #d5d5d5;
}

.btn-outline-primary:hover {
  background-color: transparent;
  border-color: transparent;
  background-image: linear-gradient(to left, #3574C0, #194F90);
}

a:hover {
  text-decoration: none;
}

.map {
  width: 100%;
  height: 75vh;
}

.location-card {
  position: absolute;
  bottom: 20px;
  display: flex;
  justify-content: center;
  width: 100%;
}
.location-card .card {
  border-radius: 12px;
}

a,
a:hover,
a:active {
  color: #000;
}


.parent {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.card-1 {
  background-color: #eaeff6;
  border: none;
  border-radius: 9px;
}

/* Margin Top for card-1 */
@media (min-width: 0) and (max-width: 575.98px) {
  .card-1 {
    margin-top: 16px !important;
  }
}
@media (min-width: 0) and (max-width: 767.98px) {
  .parent {
    display: grid;
    grid-template-columns: 2fr repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    grid-template-areas: "sad sad sad sad" "client-name client-name client-name location-image" "trip-date trip-date trip-date location-image";
  }

  .source-and-destination {
    grid-area: sad;
    justify-content: space-between;
    margin-bottom: 10px;
  }

  .source-and-destination p,
.source-and-destination img {
    margin-right: 0 !important;
  }

  .client-name {
    grid-area: client-name;
  }

  .trip-date {
    grid-area: trip-date;
  }

  .location-image {
    grid-area: location-image;
    margin-top: auto;
    margin-bottom: auto;
  }

  body {
    overflow: auto !important;
  }

  .details {
    margin-top: 16px;
  }
}
@media (min-width: 0) and (max-width: 767.98px){
  .source-and-destination {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-column-span: 7;
  }
  .client-name {
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 5;
  }
  .trip-date {
    -ms-grid-row: 5;
    -ms-grid-column: 1;
    -ms-grid-column-span: 5;
  }
  .location-image {
    -ms-grid-row: 3;
    -ms-grid-row-span: 3;
    -ms-grid-column: 7;
  }
}
.billing-card {
  background-color: #EAEFF6;
  border: 1px solid transparent;
}

.backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 555;
  display: none;
}

.drower {
  position: fixed !important;
  top: 0;
  right: 0;
  bottom: 0;
  width: 500px;
  background-color: white;
  z-index: 999;
  transform: translateX(100%);
  transition: all 0.6s ease-in-out;
}

.show-drower {
  transform: translateX(0);
  display: block !important;
}

.drower-header {
  border-bottom: 1px solid #d5d5d5;
  height: 60px;
  width: 100%;
  display: flex;
  align-items: center;
  padding: 0 25px;
  color: #000;
  font-weight: 700;
}
.drower-header i {
  font-size: 22px;
  margin-right: 12px;
}

.drower-body {
  margin-top: 20px;
  padding: 0 25px;
}

.drower-card-body {
  position: relative;
}

.car-button {
  background-image: linear-gradient(to left, #3574C0, #194F90);
  color: white !important;
  border: 1px solid transparent;
  border-radius: 0 0 3px 3px;
  width: 100%;
  padding: 4px 0;
  display: block;
  text-align: center;
  position: absolute;
  left: 0;
  bottom: 0;
}

.plan-details {
  width: 70%;
  margin-bottom: 0 i !important;
}

.drower-button {
  position: absolute;
  bottom: 15px;
  margin-bottom: 0 !important;
  left: 15px;
  right: 15px;
  width: calc(100% - 30px) !important;
}

.car-card {
  height: 155px;
}

.tri {
  cursor: pointer;
}

.clear-all {
  color: #8CA7C7;
}

.show {
  display: flex !important;
  flex-direction: column;
}

.drower-menu {
  display: none;
}

.car-plan {
  height: 50vh;
  overflow-x: hidden;
  overflow-y: auto;
}

.radio .radio__input:checked:after {
  content: "";
  background-color: royalblue;
}

.radio .radio__input:checked ~ .card {
  border: 1px solid #3574C0;
}

.active-card {
  border: 1px solid black;
}

@media (max-width: 767.98px) {
  body {
    overflow: hidden;
  }

  .drower {
    width: 100vh;
    width: 100%;
    overflow: auto;
  }

  .drower-body {
    height: calc(100vh - 60px);
  }

  .drower-button {
    position: relative;
    width: 100%;
    left: 0;
    right: 0;
    bottom: 15px;
  }

  .plan-details {
    width: 90%;
  }

  .tab-content {
    margin-top: 16px;
  }
}
.round-bg {
  width: 16px;
  height: 16px;
  background-color: #D8D8D8;
  border-radius: 50%;
}

.small {
  width: 6px;
  height: 6px;
  border-radius: #D8D8D8;
  border-radius: 50%;
}

h4,
.h4 {
  font-size: 16px !important;
}

.form-layout .form-group label {
  top: 3px !important;
}

label {
  position: relative;
  cursor: pointer;
}
label .search-icon::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 16px;
  right: 16px;
  bottom: 0;
  color: #828e9e;
}
label input {
  width: 16px;
  height: 16px;
  border: none;
  outline: none;
  padding: 16px;
  border-radius: 8px;
  font-size: 1em;
  transition: 0.5s;
  color: #a3acc4;
  background-color: #fff;
  caret-color: #828e9e;
  caret-width: 2px;
  position: relative;
}
label input:hover {
  cursor: pointer;
}
label input:focus {
  width: 100%;
}
label input:focus ~ .search-icon {
  transition: 0.1s;
  opacity: 0;
}

body {
  position: relative;
}

.backdrop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  height: 100vh;
  z-index: 555;
  background-color: #000000;
  opacity: 20%;
}

aside {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  height: 100vh;
  width: 280px;
  background-color: white;
  z-index: 9;
}

aside img.logo {
  position: relative;
  margin-top: 15px;
  margin-left: 15px;
}

aside a {
  margin-top: 8px;
  height: 56px;
}

aside a.btn {
  text-align: left;
}

aside a.btn-primary {
  background-image: linear-gradient(to left, #3574C0, #194F90);
  color: white;
  padding: 0 15px;
}

.text-primary {
  color: #194F90;
}

.modal .btn-primary {
  background-image: linear-gradient(to left, #3574C0, #194F90);
  color: white;
  height: 56px;
}

.modal-dialog {
  width: 1000px;
}

.right-icon {
  width: 250px;
  height: 250px;
  margin: 0 auto;
}

.modal-dialog {
  width: 1000px;
}

.login,
.forgot-password-details {
  position: relative;
  z-index: 1;
}

@media (min-width: 0px) and (max-width: 767.98px) {
  .modal-dialog {
    width: auto !important;
  }
}
body {
  font-family: "product_sans", Arial, sans-serif !important;
  font-size: 16px;
}

.radio {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  margin-right: 10px;
}
.radio .radio__input {
  display: none;
}
.radio .radio__input:checked + .radio__radio {
  border: 2px solid #194F90;
}
.radio .radio__input:checked + .radio__radio::after {
  transform: scale(1);
}
.radio .radio__radio {
  width: 1.25em;
  height: 1.25em;
  border: 2px solid #d8e4e2;
  border-radius: 50%;
  margin-right: 10px;
  box-sizing: border-box;
  padding: 4px;
}
.radio .radio__radio::after {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  background-color: #194F90;
  border-radius: 50%;
  transform: scale(0);
  transition: transform 0.15s;
}

.drower-nav {
  border-bottom: 1px solid #d5d5d5;
}

.drower-tab-content {
  border-left: 1px solid #d5d5d5;
}

.drower-left {
  width: 45%;
}

.drower-right {
  width: 55%;
}

.section-devider {
  background-color: #E5E5E5;
  height: 15px;
  width: 100%;
  display: block;
}

.navbar-light .navbar-nav .nav-link {
  color: #000 !important;
}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
  color: #3574C0 !important;
}

.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show > .nav-link {
  color: #3574C0 !important;
}

.navbar {
  border-bottom: 1px solid #D1D1D1;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
}

.navbar-brand {
  padding: 22px 0 !important;
}

.nav-item {
  padding: 0 !important;
}

@media (min-width: 0px) and (max-width: 767.98px) {
  .menu {
    display: none;
  }

  .menu-icon {
    display: block;
  }

  .contact-service {
    margin-top: 16px;
  }
}
@media (min-width: 768px) {
  .menu-icon {
    display: none;
  }

  .menu {
    display: block;
  }
}
.form-layout {
  outline: none;
}
.form-layout .form-group {
  position: relative;
  margin-bottom: 35px;
}
.form-layout .form-group .input-field {
  background-color: transparent;
  display: block;
  outline: none;
  font-weight: normal;
  border-radius: 4px;
  color: #202124;
  font-size: 17px;
  height: 65px;
  width: 100%;
  padding: 0 18px;
  z-index: 1;
  border: 1px solid #d1d1d1;
  transition: all 0.3s ease-in-out;
}
.form-layout .form-group .input-field:focus {
  border-color: #194F90;
  border-width: 2px;
  transition: none;
}
.form-layout .form-group .input-field:focus + label {
  transform: translateY(-12px) scale(0.8);
  background-color: #fff;
  color: #194F90;
  padding: 0 8px;
  z-index: 1;
}
.form-layout .form-group .input-field::placeholder {
  color: transparent;
}
.form-layout .form-group .input-field:not(:placeholder-shown) + label {
  transform: translateY(-12px) scale(0.8);
  background-color: #fff;
  padding: 0 8px;
  z-index: 1;
}
.form-layout .form-group .input-field :-webkit-autofill,
.form-layout .form-group .input-field :-webkit-autofill:focus,
.form-layout .form-group .input-field :-webkit-autofill:hover,
.form-layout .form-group .input-field :-webkit-autofill:active {
  box-shadow: 0 0 0 100px #fff inset;
  -webkit-transition: background-color 5000s ease-in-out 0s;
  transition: background-color 5000s ease-in-out 0s;
  transition-delay: 99999s;
  -webkit-text-fill-color: #202124;
}
.form-layout .form-group label {
  position: absolute;
  top: 0;
  left: 8px;
  color: #5d5d5d;
  font-size: 14px;
  font-weight: 400;
  transform: translateY(15px);
  padding: 0 8px;
  cursor: text;
  z-index: -1;
  letter-spacing: 0.4;
  text-transform: capitalize;
  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), opacity 150ms cubic-bezier(0.4, 0, 0.2, 1);
}
.form-layout .form-group textarea.input-field {
  height: 100%;
}
.form-layout .btn-primary {
  outline: none;
  letter-spacing: 0;
  border: none;
  -webkit-appearance: none;
          appearance: none;
  width: 100%;
  background-color: #0089f1;
  color: #fff;
  cursor: pointer;
  font-size: 18px;
  border-radius: 4px;
  height: 54px;
  line-height: 54px;
  text-align: center;
  display: block;
  padding: 0 20px;
}
.form-layout .btn-primary:not(:disabled):not(.disabled):active {
  background-color: #0089f1;
}
.form-layout .btn-primary:focus {
  outline: none;
  border: none;
  box-shadow: none;
}

.opt-text-field {
  border: none;
  border-bottom: 2px solid #d8d8d8;
  margin: 0 20px;
  width: calc( 100% - 40px) !important;
}

.eye {
  position: absolute;
  font-size: 20px;
  right: 18px;
  top: 17px;
  color: gray;
  z-index: 1;
}
.eye:hover {
  cursor: pointer;
}

.ripple {
  position: relative;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
}

.ripple::after {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  content: "";
  display: block;
  pointer-events: none;
  background-image: radial-gradient(circle, #000 10%, transparent 15%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10);
  opacity: 0;
  transition: transform 0.5s, opacity 1s;
}

.ripple:active::after {
  transform: scale(0);
  opacity: 0.2;
  transition: 0s;
}

.cp-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 1px solid #D1D1D7;
  border-radius: 8px;
  height: 54px;
  padding-left: 15px;
  padding-right: 15px;
  color: #333;
  margin-bottom: 35px;
}

p {
  margin-bottom: 0;
}

.iti {
  display: block;
}

.iti--allow-dropdown .iti__flag-container, .iti--separate-dial-code .iti__flag-container {
  left: 6px;
}

.iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag {
  background-color: transparent;
}

@media (min-width: 0px) and (max-width: 767.98px) {
  .invoice-footer {
    flex-direction: column !important;
  }
  .invoice-footer .left {
    order: 2;
  }
  .invoice-footer .left .btn {
    margin-top: 5px !important;
  }
  .invoice-footer .right {
    order: 1;
    width: 100%;
    justify-content: space-between !important;
    margin-top: 10px;
    padding: 0 15px;
  }
}
/* Change Header Navigation Background Color */ 
.site-header.header-two,
.header-navigation.stricky-fixed {
  background-color: white;
}

/* Change Header Navigation Link Color */
.site-header.header-two .header-navigation ul.navigation-box > li.current > a, .site-header.header-two .header-navigation ul.navigation-box > li:hover > a {
  color: #194F90;
}

/* Hide Dot Before Link in Header Navigation */
.header-navigation ul.navigation-box > li > a:before {
  display: none;
}

/* Change Dot Background Color in Header Navigation */
.site-header.header-two .header-navigation ul.navigation-box > li > a:before {
  background-color: #194F90;
}

/* Fix Navigation Height And Align Logo */
.header-navigation .main-navigation {
  height: 78px;
  width: inherit;
  display: flex !important;
  justify-content: flex-start;
  align-items: center;
}

.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .show > .nav-link {
  color: #194F90;
  font-weight: 600;
  font-size: 16px;
  text-transform: capitalize;
  letter-spacing: 0;
}

.navbar-light .navbar-nav .nav-link {
  color: #B5B5B5;
  font-weight: 600;
  font-size: 16px;
  text-transform: capitalize;
  letter-spacing: 0;
  margin-left: 45px;
}

.nav-link:nth-child(1) {
  margin-left: 0;
}

.nav-item {
  padding: 22px 0;
}

.navbar {
  padding-top: 0;
  padding-bottom: 0;
}

.navbar-brand {
  padding-top: 0;
  padding-bottom: 0;
}

.bg-light {
  background-color: white !important;
}

.navbar-light .navbar-nav .nav-link:focus,
.navbar-light .navbar-nav .nav-link:hover {
  color: #194F90;
}

.push-container {
  margin-top: 100px;
}

@media (max-width: 991.98px) {
  .navbar-expand-lg .navbar-collapse {
    display: block !important;
    height: 0;
  }

  .navbar-collapse.show {
    overflow-y: auto !important;
    height: auto;
  }

  .navbar-expand-lg .navbar-collapse {
    background-color: transparent !important;
  }

  .navbar-light .navbar-nav .nav-link {
    margin-left: 0;
  }

  .navbar-brand {
    padding-top: 0.3125rem !important;
    padding-bottom: 0.3125rem !important;
  }

  .nav-item {
    padding: 0;
  }
}
/* Hide Circle in Slider */ 
.banner-style-two .banner-circle {
  visibility: hidden;
}

/* Change Dot Color in Section Title */
.block-title .dot-line {
  background-color: #194F90;
}

/* Full Width Card */
.hvr-float-shadow {
  width: 100%;
}

/* Align Text Center in Cards */
.single-offer-one .text-block {
  text-align: center;
}

/* Change Offer Style One Background Color */
.offer-style-one {
  background-color: #EBF4FF;
}

/* Change Founder Name Color */
.founder-name {
  color: #000;
}

.dropdown:hover > .dropdown-menu {
  display: block;
  cursor: pointer;
}

.scroll-to-top,
.scroll-to-top:after, .scroll-to-top:before {
  background-image: linear-gradient(to Bottom, #3574C0, #194F90);
}

.scroll-to-top i {
  color: white;
}

.taxi-style-one .tab-title li a.active,
.taxi-style-one .tab-title li a:hover,
.single-taxi-one:hover .book-taxi-btn {
  background: transparent !important;
  background-image: linear-gradient(to Bottom, #3574C0, #194F90) !important;
  color: white !important;
}

.nav-tabs {
  border-bottom: 0;
}

.nav-tabs .nav-link.active::after {
  content: "";
  width: 100%;
  height: 4px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #194F90;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  padding-bottom: 13px;
  color: #194F90;
}

.nav-tabs .nav-link {
  color: #212529;
  border: none;
  position: relative;
}

.texi-tabs .nav-link.active::after {
  display: none;
}

/* .otp-verification {
  display: none;
}

.forgot-password-details {
  display: none;
} */

.site-footer:before,
.site-footer:after {
  display: none;
}

.site-footer {
  background-color: #57585A;
}

.site-footer .footer-widget .widget-title {
  margin-bottom: 22px;
}

.site-footer .footer-widget .link-lists li + li {
  margin-top: 0;
}

.site-footer .bottom-footer .inner-container {
  justify-content: center;
  padding: 20px 0;
}

.site-footer .footer-bg {
  height: 100%;
}

.fa-twitter,
.fa-facebook-f,
.fa-instagram {
  font-size: 24px;
  color: white;
  margin: 5px 6px;
}

.site-footer .upper-footer {
  padding-bottom: 80px;
  padding-top: 80px;
}

.site-footer .footer-widget .link-lists li a:hover {
  color: white;
}

.site-footer .footer-widget .link-lists li a:before {
  color: white;
}

.single-offer-one .text-block {
  padding: 0;
  width: 270px;
  height: 285px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.km,
.pe,
.ta {
  width: 152px;
  height: 74px;
}

.hp {
  width: 152px;
  height: 100px;
  margin-bottom: 0 !important;
}

.pickup-details-card:nth-last-child(1) {
  margin-bottom: 30px;
}