@import url('https://fonts.googleapis.com/css2?family=Rubik&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300;400&display=swap');

@font-face {
   font-family: 'rubikregular';
   src: url('../../assets/fonts/rubik-regular-webfont.woff2') format('woff2'),
      url('../../assets/fonts/rubik-regular-webfont.woff') format('woff');
   font-weight: normal;
   font-style: normal;

}

@font-face {
   font-family: 'Antipasto Pro';
   src: url('../../assets/fonts/AntipastoPro-DemiBold.woff') format('woff2'),
      url('../../assets/fonts/AntipastoPro-DemiBold.woff') format('woff');
   font-weight: 600;
   font-style: normal;
   font-display: swap;
}

@font-face {
   font-family: 'Antipasto Pro';
   src: url('../../assets/fonts/AntipastoPro-ExtraBold.woff2') format('woff2'),
      url('../../assets/fonts/AntipastoPro-ExtraBold.woff') format('woff');
   font-weight: bold;
   font-style: normal;
   font-display: swap;
}

.set-profile{
   display: flex;
   justify-content: center;
}

* {
   margin: 0;
   padding: 0;
}

body {
   overflow-x: hidden;
}

::-webkit-scrollbar {
   width: 5px;
   height: 5px;
}

::-webkit-scrollbar-track {
   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
   -webkit-border-radius: 10px;
   border-radius: 10px;
}

::-webkit-scrollbar-thumb {
   -webkit-border-radius: 10px;
   border-radius: 10px;
   background: rgba(255, 255, 255, 0.3);
   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

::-webkit-scrollbar-thumb:window-inactive {
   background: rgba(255, 255, 255, 0.3);
}

.main-menubar {
   width: 100%;
   display: flex;
   padding: 0px 25px;
}

.navbar-brand {
   line-height: 4;
}


.navbar-nav {
   margin: 0px auto;
   position: relative;
}

.img-back-shadow {
   background-color: #f2f2f4;
   width: 100px;
   height: 113px;
   border-bottom-left-radius: 50px;
   border-bottom-right-radius: 50px;
   margin-top: -15px;

}

.img-back-shadow img {
   width: 70px;
   height: 70px;
}

.dropdown {
   padding-right: 40px;
}

.rounded-circle {
   margin-right: 15px;
   margin-top: 30px;
   border: 1px solid #fff;
   box-shadow: rgb(48 51 107 / 10%) 0px 10px 15px 1px, rgb(48 51 107 / 5%) 0px 4px 6px -1px;

}

.navbar-toggler {
   border: none;
}

.navbar-toggler .navbar-toggler-icon {
   display: inline-block;
   width: 1.5em;
   height: 1.5em;
   vertical-align: middle;
   background-image: var(--bs-navbar-toggler-icon-bg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: 100%;
}

.navbar-toggler:hover,
.navbar-toggler:active,
.navbar-toggler:focus {
   box-shadow: none;
}

.navbar-nav li {
   padding: 0px 45px 0px 45px;
}

.navbar-nav li a {
   font-family: "rubik";
   font-size: 18px;
   color: #130F40;
   /* padding-left: 80px; */
   opacity: 0.7;
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link:focus, .navbar-nav .nav-link:hover {
   font-weight: bold;
   opacity: 1;
}

.navbar-toggler>.close {
   position: relative;
   display: inline;
   z-index: 99;
   color: #fff;
}

.navbar-toggler>.close {
   display: inline;
}

.navbar-toggler .close .fa-xmark {
   font-size: 1.9rem;
}

.navbar-toggler.collapsed>.close, .navbar-toggler:not(.collapsed)>.navbar-toggler-icon {
   display: none;
   z-index: 9;
}

.dropdown-menu {
   -moz-appearance: none;
   /* width: 300px !important;
   height: 400px !important; */
}

.dropdown-menu[data-bs-popper] {
   top: -10px;
   border-radius: 0px;
   border-bottom-left-radius: 75px;
   left: unset;
   width: 350px;
   right: -10px;
   border: 0px;
   box-shadow: rgb(48 51 107 / 10%) -4px 16px 34px -5px;
}
#large-form {
   display: none;
}
/* .profile{
   right: -13px !important;
    left: -120px;
    top: -10px;
    border-radius: 0px;
    border-bottom-left-radius: 30px;
} */
/* ................edit-profile-modal..................... */


.profile-detail-modal .modal {
   padding-right: 0px !important;
}

.profile-detail-modal .modal-header {
   display: flex;
   justify-content: end;
   border-bottom: 0px;
   padding: 12px 0px;
}

.profile-detail-modal .modal-dialog {
   margin-right: 0px;
   margin-top: 0px;
   border-radius: 0px;
}

.profile-detail-modal .modal-content {
   border-radius: 0px;
   position: absolute;
   right: 0px;
   width: 85%;
   border-bottom-left-radius: 75px;
   border: 0px;
}

.edit-profile {
   display: flex;
   justify-content: end;
}

.edit-profile a {
   text-decoration: none;
   color: #130F40;
   font-family: 'rubikregular';
   font-size: 16px;
   /* padding-right: 10px; */
   /* font-weight: bold; */
}

.profile-sec {
   margin-bottom: 40px;
   display: flex;
   flex-direction: row;
}

.profile-img {
   width: 100%;
   height: auto;
   border-radius: 10px;
   display: flex;
   justify-content: center;
   position: relative;
   margin-left: 5px;
}

.profile-img img {
   width: 80%;
   height: auto;
   object-fit:cover;
}

.profile-img-on-name {
   width: 80%;
   position: absolute;
   bottom: 0px;
   left: unset;
   /* filter: blur(0px);
   background: rgba(255, 255, 255, .9);
   border-top-right-radius: 30px; */
   padding-top: 5px;
   padding-bottom: 0px;
   /* text-align: start;
    */
    display: flex;
    justify-content: end;
}
.gender-icon{
   display: flex;
   justify-content: end;
   filter: blur(0px);
   background: rgba(255, 255, 255, .9);
   width: 38%;
   height: auto;
   padding: 9px 9px 3px 9px;
   border-top-left-radius: 27px;
}
.profile-img-bottom-name {
   display: none;
}

.profile-img-on-name p {
   font-size: 12px;
   color: #130F40;
   margin-bottom: 0px;
   font-family: 'rubikregular';
   padding-left: 0px;
}

.profile-phone-email {
   width: 100%;
}

.profile-phone p {
   color: #130F40;
   font-weight: bold;
   font-family: 'rubikregular';
   font-size: 16px;
   margin-bottom: 0px;
   text-align: start;
}

.profile-phone-nu p {
   color: #130F40;
   font-family: 'rubikregular';
   font-size: 14px;
   margin-bottom: .5rem;
   margin-top: .5rem;
   padding-left: 30px;
   text-align: start;
}

.profile-logout {
   margin-top: 8px;
   display: flex;
   justify-content: center;
}

.profile-logout a {
   border: none;
   background-color: #F8F8FA ;
   padding: 5px 60px;
   /* margin-right: 8px; */
   font-family: 'rubikregular';
   color: #130F40;
   font-weight: 500;
}

.profile-logout a:hover, .profile-logout a:active, .profile-logout a:focus {
   background-color: #130F41 !important;
   border-color:#130F40 !important;
   color: #fff !important
}

.edit-profile-title {
   padding: 0px 35px;
}

.edit-title {
   width: 100%;
   height: auto;
   margin-top: 30px;
}

.edit-title h3 {
   color: #130F40;
   font-family: 'rubikregular';
   font-weight: bold;
   margin-bottom: 0px;
   text-align: justify;
}

.edit-title .line {
   width: 64px;
   height: 3px;
   background-color: #130F40;
}

.edit-profile-form {
   width: 100%;
   height: auto;
   /* padding-right: 40px; */

}

.gender-btn-edit-profile {
   width: 100%;
   margin-top: 13px;
}

.gender-btn-edit-profile .gender-label {
   margin-top: 4px;
   display: flex;
   justify-content: center;
   color: #212529;
}

.gender-btn-edit-profile label {
   font-weight: bold;
   font-family: 'rubikregular';
}

.edit-gender-btn {
   list-style-type: none;
   /* margin: 25px 0 0 0; */
   display: flex;
   padding: 0;
}

.edit-gender-btn {
   margin-bottom: 0rem;
}

.edit-gender-btn li {
   float: left;
   margin: 0 5px 0 0;
   width: 100px;
   height: 33px;
   position: relative;
}

.edit-gender-btn label,
.edit-gender-btn input {
   display: block;
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   text-align: center;
   border-radius: 10px;
   font-weight: 400 !important;
   background-color: rgba(243, 243, 245, .7);
   width: 73px;
   height: 100%;
}

.edit-gender-btn input[type="radio"] {
   opacity: 0.01;
   z-index: 100;
}

.edit-gender-btn input[type="radio"]:checked+label,
.Checked+label {
   background: #130F40;
   color: #fff;
   opacity: 1;
   border: unset
}

.edit-gender-btn label {
   padding: 5px;
   background: #F8F8FA;
   /* border: 1px solid #F8F8FA; */
   cursor: pointer;
   z-index: 90;
   font-size: 14px;
   font-family: 'rubikregular';
   color: #D1D0D9 !important;
}

.create-gender-btn {
   list-style-type: none;
   /* margin: 25px 0 0 0; */
   display: flex;
   padding: 0;
}

.create-gender-btn {
   margin-bottom: 0rem;
}

.create-gender-btn li {
   float: left;
   margin: 0 5px 0 0;
   width: 100px;
   height: 33px;
   position: relative;
}

.create-gender-btn label,
.create-gender-btn input {
   display: block;
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   text-align: center;
   border-radius: 10px;
   font-weight: 400 !important;
   background-color: rgba(243, 243, 245, .7);
   width: 73px;
}

.create-gender-btn input[type="radio"] {
   opacity: 0.01;
   z-index: 100;

}

.create-gender-btn input[type="radio"]:checked+label,
.Checked+label {
   background: #130F40;
   color: #fff;
   opacity: 1;
}

.create-gender-btn label {
   padding: 5px;
   background: #F8F8FA;
   border: 1px solid #F8F8FA;
   cursor: pointer;
   z-index: 90;
   font-size: 14px;
   font-family: 'rubikregular';
   color: #D1D0D9 !important;
}

/* .gender-btn-edit-profile button
{
   width: 100%;
   background-color: #F8F8FA;
   padding: 5px 9px;
   text-align: center;
}
.gender-btn-edit-profile button:hover {
   background-color: #130F40;
   color: #fff;
}
.gender-btn-edit-profile button:hover, .gender-btn-edit-profile button:active, .gender-btn-edit-profile button:focus{
   background-color: #130F40;
   color: #fff;
}
.gender-btn-edit-profile label
{
   color: #130F40;
   font-family: 'rubikregular';
   font-weight: bold;
} */
/* .edit-form{
  position: relative;
  margin-top: 30px;
 }
.edit-form .effect-22 {
   width: 100%;
   border: 0;
   padding: 6px 15px;
   border: 1px solid rgba(243, 243, 245, .7);
   background: transparent;
   border-radius: 10px;
   background-color: rgba(243, 243, 245, .7);
   z-index: 1;
}
.edit-form  .effect-22:active,
.edit-form  .effect-22:focus {
   background-color: #fff;
   box-shadow: unset;
   
}

.edit-form  .effect-22~label {
   text-align: left;
   position: absolute !important;
   left: 30px;
   width: 22%;
   top: 6px;
   color: #130F40;
   transition: 0.3s;
}

.edit-form .effect-22~label:active{
   z-index:-1;
}

.edit-form .effect-22:focus~label,
.has-content.effect-22~label {
   text-align: left;
   top: -20px;
   left: 30px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
   opacity: 0;
}

.edit-form .has-content.effect-22~label {
   text-align: left;
   top: -18px;
   left: 30px;
   font-size: 12px;
   color: #333;
   transition: 0.3s; */
/* text-align: start; 
}
/* .effect-22:focus~label,
.has-content.effect-22~label {

   top: -18px;
   left: 0;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
} */
.reset-password-link {
   width: 100%;
   display: flex;
   justify-content: center;
   background-color: #f5f5f9;
   padding-top: 12.5px;
   padding-bottom: 12.5px;
   border-bottom-left-radius: 20px;
}

.reset-password-link a {
   text-decoration: none;
   color: #130F40;
   font-family: 'rubikregular';
   font-weight: normal;
}

.edit-profile-img {
   background-color: #f5f5f7;
   width: 100%;
   height: 100%;
   /* text-align: center; */
   border-top-right-radius: 85px;
   border-bottom-right-radius: 20px;
   display: flex;
   flex-direction: column;
}

.profile-round-img {
   width: 100%;
   height: auto;
   display: flex;
   justify-content: center;
   margin-top: 15px;
}

/* .p-r-img {
   width: 130px;
   max-height: 130px;
   border-radius: 100%;
   background: #000;
   position: relative;
  
   line-height: 120px;
} */

.p-r-img {
   width: 130px;
   max-height: 130px;
   border-radius: 100%;
   background: #000;
   position: relative;
   display: inline-block;
   line-height: 120px;
   overflow: hidden;
   height: 130px;
 }

.p-r-img-overlay {
   width: 130px;
   height: 130px;
   border-radius: 50%;
   background: rgba(0, 0, 0, .2);
   position: absolute;
   backdrop-filter: blur(2px);
   -webkit-backdrop-filter: blur(2px);
   -moz-backdrop-filter: blur(2px);
   top: 0px;
   text-align: center;
}

.p-r-img-overlay .file-upload {
   display: none;
}

.p-r-img-overlay a {
   color: #fff;
   /* text-align: center; */
   text-decoration: none;
   font-family: 'rubikregular';
   font-size: 12px;
   font-weight: lighter;
   width: 130px !important;
   height: 130px;
   display: flex;
   justify-content: center;
   align-items: center;

}

/* .profile-round-img img {
   width: 100%;
   height: auto;
} */

.profile-round-img img {
   width: 130px;
   height: 130px;
 }


.profile-bottom-round-img {
   overflow: hidden;
   position: relative;
}

.round-profile {
   position: relative;
   top: 141px;
   left: 15px;

}

.edit-profile-confirm-btn {}

.create-send {
   width: 100%;
   height: auto;
   display: flex;
   justify-content: center;
   margin-top: 30px;
   margin-bottom: 100px;
}

.edit-profile-confirm-btn {
   width: 100%;
   display: flex;
   justify-content: center;
}

.edit-profile-confirm-btn button {
   background-color: #130F40;
   margin-top: 30px;
   border-radius: 10px;
   margin-bottom: 30px;
}

.edit-profile-confirm-btn a button {
   padding: 5px 34px;
   color: #fff;
   text-decoration: none;
   font-family: 'antipasto pro';
   font-size: 20px;
}

.edit-profile-confirm-btn button:hover, .edit-profile-confirm-btn button:active, .edit-profile-confirm-btn button:focus {
   background-color: #130F40 !important;
   color: #fff !important;
   border-color: #130F40  !important;
}

.edit-profile-modal .modal-content {
   border-top-right-radius: 85px
}

.edit-form {
   position: relative;
   margin-top: 30px;
}

.edit-form .effect-22 {
   width: 100%;
   border: 0;
   padding: 6px 15px;
   border: 1px solid rgba(243, 243, 245, .7);
   position: relative;
   background: transparent;
   border-radius: 10px;
   background-color: rgba(243, 243, 245, .7);
   z-index: 1;
}

.edit-form .effect-22:active,
.edit-form .effect-22:focus {
   background-color: #fff;
   box-shadow: unset;
   border: 1px solid rgb(19, 15, 64, .7);
}

.edit-form .effect-22~label {
   text-align: left;
   position: absolute;
   left: 30px;
   width: 60%;
   top: 6px;
   color: #130F40;
   transition: 0.3s;
}

.edit-form .effect-22~label:active {
   z-index: -1;

}

.edit-form .effect-22:focus~label,
.has-content.effect-22~label {
   text-align: left;
   top: -18px;
   left: 25px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
   opacity: 1;
}

.edit-form .has-content.effect-22~label {
   text-align: left;
   top: -18px;
   left: 25px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
}

@media only screen and (max-width:992px) {
   .main-menubar {
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
   }
}

@media only screen and (max-width:767px) {
   .edit-title {
      margin-top: 0px !important;
   }

   .reset-title {
      margin-top: 0px !important;
   }

}

@media only screen and (max-width:756px) {

   .profile-bottom-round-img {
      display: none;
   }

   .edit-profile-modal .modal-content {
      border-top-right-radius: 20px;
   }

   .edit-profile-modal .modal-header {
      border-bottom: 0px;
      display: flex;
      justify-content: end;
      padding: 0px;
      z-index: 2;
   }

   .edit-profile-modal .modal-header button span {
      font-size: 30px;
   }

   .edit-profile-modal .modal-body {
      /* top: -65px; */
   }

   #edit_profile .modal-dialog {
      margin: 60px auto;
   }

   .p-r-img {
      box-shadow: rgb(48 51 107 / 36%) -2px 11px 30px 4px;
      outline: 5px solid #fff;

   }

   .gender-btn-edit-profile {
      margin-top: 30px;
   }

   /* .edit-form{
         margin-top: 20px;
      } */
   .reset-password-link {
      background-color: unset;
      border-radius: 0px;
      padding: 0px;

   }

   .edit-profile-confirm-btn button {
      margin-bottom: 10px;
   }

   .reset-password-link a {
      color: #D5D9DC;
      font-weight: 500;
   }

   .gender-btn-edit-profile .gender-label {
      justify-content: start;
      margin-left: 5px;
   }

   .edit-gender-btn {
      justify-content: end;
   }

   .edit-gender-btn li {
      margin: 0px;
   }

   .edit-form .effect-22 {
      width: 100%;
   }

   .reset-password .modal-header {
      border-bottom: 0px;
      display: flex;
      justify-content: end;
      padding: 0px;
      z-index: 2;
   }

   .reset-password .modal-header button span {
      font-size: 30px;
   }

   .reset-password .modal-body {
      /* top: -65px; */
   }

   #reset_password .modal-dialog {
      margin: 60px auto;
   }
}

@media only screen and (max-width:576px) {
   #edit_profile .modal-dialog {
      margin: 60px 40px;
   }

   #reset_password .modal-dialog {
      margin: 60px 40px;
   }
}

@media only screen and (max-width:480px) {
   .edit-profile-title {
      padding: 0px 10px !important;
   }
   .forgotpass-profile-title{
      padding: 0px 5px !important;
   }
   .resetpass-profile-title {
      padding: 0px 10px !important;
   }

   #edit_profile .modal-dialog {
      margin: 60px 20px;
   }

   #reset_password .modal-dialog {
      margin: 60px 20px;
   }
}

/* ...............reset-password modal................... */
.reset-password .modal-content {
   border-top-right-radius: 85px
}
.forgotpass-profile-title{
   padding: 0px 25px;
}
.resetpass-profile-title {
   padding: 0px 35px;
}

.reset-title {
   width: 100%;
   height: auto;
   margin-top: 30px;
}

.reset-title h3 {
   color: #130F40;
   font-family: 'rubikregular';
   font-weight: bold;
   margin-bottom: 0px;
   text-align: justify;
}

.reset-title .line {
   width: 65px;
   height: 3px;
   background-color: #000;
}

.reset-pass-form {
   width: 100%;
   height: auto;
}

.reset-form {
   position: relative;
   margin-top: 30px;
}

.reset-form .effect-22 {
   width: 100%;
   border: 0;
   padding: 6px 15px;
   border: 1px solid rgba(243, 243, 245, .7);
   position: relative;
   background: transparent;
   border-radius: 10px;
   background-color: rgba(243, 243, 245, .7);
   z-index: 1;
}

.reset-form .effect-22:active,
.reset-form .effect-22:focus {
   background-color: #fff;
   box-shadow: unset;
   border: 1px solid rgb(19, 15, 64, .7);
}

.reset-form .effect-22~label {
   text-align: left;
   position: absolute;
   left: 30px;
   width: 100%;
   top: 6px;
   color: #130F40;
   transition: 0.3s;
}

.reset-form .effect-22~label:active {
   z-index: -1;

}

.reset-form .effect-22:focus~label,
.has-content.effect-22~label {
   text-align: left;
   top: -18px;
   left: 25px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
   opacity: 1;
}

.reset-form .has-content.effect-22~label {
   text-align: left;
   top: -18px;
   left: 30px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
}

.enter-pass-line {
   width: 80%;
   height: 2px;
   background-color: #f7f7f8;
   margin-top: 20px;
   margin-bottom: 10px;
}

.reset-pass-img {
   width: 100%;
   height: 100%;
   /* text-align: center; */
   border-top-right-radius: 85px;
   border-bottom-right-radius: 20px;
   display: flex;
   flex-direction: column;
   background-color: #f5f5f7;
}

.reset-round-img {
   width: 100%;
   height: auto;
   display: flex;
   justify-content: center;
   margin-top: 15px;
}

.r-r-img {
   /* width: 130px;
   height: 130px;
   border-radius: 50%;
   background: #000;
   position: relative;
   line-height: 120px;
   overflow: hidden; */
   width: 130px;
   max-height: 130px;
   border-radius: 100%;
   background: #000;
   position: relative;
   display: inline-block;
   line-height: 120px;
   overflow: hidden;
   height: 130px;
}

.r-r-img img {
   width: 130px;
   height: 130px;

}

.reset-update-pass-btn {
   width: 100%;
   display: flex;
   justify-content: center;
}

.reset-update-pass-btn button {
   margin-top: 40px;
   border-radius: 10px;
   margin-bottom: 40px;
   background-color: #130F40;
   padding: 5px 24px;
   color: #fff;
   text-decoration: none;
   font-family: 'antipasto pro';
   font-size: 20px;
   border-color:#130F40;
}

.reset-update-pass-btn button:hover, .reset-update-pass-btn button:focus, .reset-update-pass-btn button:active {
   background-color: #130F40;
   color: #fff;
   border-color: #130F40;
}

@media only screen and (min-width:992px) and (max-width:1075px) {
   .number-input-container .decrement {
      /* bottom: 30px !important; */
   }
}

@media only screen and (max-width: 992px) {

   /* .dropdown-menu[data-bs-popper]{
      width: 100vw;
      height: 100vh;
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
   } */
   .main-menubar {
      padding: 0px;
   }

   .navbar-toggler {
      /* position: absolute;
      right: 0px !important;
      top: 30% !important; */
      padding: 0px;
   }

   .dropdown {
      height: auto;
      width: 100px;
      position: absolute;
      /* left: 420px !important;
      right: 0px; */
      /* left: 50%; */
      right: 20%;
      text-align: right !important;

   }

   .navbar-collapse {
      position: fixed;
      right: 0px;
      top: 0px;
      z-index: 2;
      height: 100vh;
      backdrop-filter: blur(2px);
      transition: height .35s ease;
   }
}

@media only screen and (max-width: 767px) {


   .custom-btn {
  
      border-radius: 36px;
      font-size: 14px !important;
      padding: 5px 10px;
      
  }
   .profile-detail-modal .modal-content {
      background-color: rgba(19, 15, 65, 0.5);
      backdrop-filter: blur(2px);
      /* padding: 20px; */
   }

   .edit-profile-img {
      background-color: unset;
      border-top-right-radius: 0px;
      border-bottom-right-radius: 0px;
   }

   .edit-profile {
      justify-content: start;
      margin-left: 22px!important;
   }

   .profile-detail-modal .modal-content {
      border-bottom-left-radius: 0px;
      border: 0px;
   }

   .profile-detail-modal .modal-dialog {
      max-width: 100%;
      height: 100%;
      margin: 0px !important;
      padding: 0px !important;
   }

   .profile-detail-modal .modal-content {
      width: 100%;
      height: 100vh;
   }

   .edit-profile a {
      font-weight: normal;
      font-size: 16px;
   }

   .profile-sec {
      flex-direction: column;
   }

   /* .profile-img {
      width: 100px;
      height: 100px;
      border-radius: 50% !important;
      margin: 0px auto;
      position: relative;
      overflow: hidden;
      border: 5px solid #fff;
      box-shadow: rgb(48 51 107 / 10%) 7px 22px 19px -5px;

   } */
   .set-profile{
      display: flex;
      flex-direction: column;
   }

   .profile-img {
      /* padding-top: 15px; */
      width: 132px;
      height: 130px;
      line-height: 50%;
      border-radius: 50% !important;
      margin: 0px auto;
      position: relative;
      overflow: hidden;
      border: 5px solid #fff;
      box-shadow: rgb(48 51 107 / 10%) 7px 22px 19px -5px;
  }
   .profile-img-on-name {
      display: none;
   }

   .profile-img-bottom-name {
      width: 100%;
      text-align: center;
      display: block;
   }

   .profile-img-bottom-name p {
      color: #fff;
      margin-bottom: 0px;
   }

   .edit-profile a {
      color: #fff;
      /* padding-left: 20px; */
   }

   /* .profile-img img {
      width: 100%;
      height: auto;
      border-radius: 50%;
      object-fit: cover;
   } */
   .profile-img img {
      width: 100%;
      height: auto;
      border-radius: 10px;
    }
   .profile-phone-email p {
      color: #fff;
   }

   .profile-phone-email .row {
      width: 75%;
      margin: 3rem auto;
   }

   .profile-logout {
      position: absolute;
      left: 0;
      right: 0;
     
   }

   .dropdown {
      height: auto;
      width: 100px;
      position: absolute;
      /* left: 370px !important;
      right: 0px; */
      text-align: right !important;
   }

   .navbar-collapse {
      position: absolute;
      right: 0px;
      top: 0px;
      height: 100vh;
      z-index: 2;
   }

   #profile-detail .modal-body {
      /* padding:0rem 1.5rem; */
   }

   #profile-detail .modal-header button span {
      font-size: 30px;
      /* padding-right: 7px; */
      color: #fff;
   }

   #profile-detail .modal-header {
      border-bottom: 0px;
      padding: 0px;
   }

   #profile-detail .modal-header button {
      margin-left: auto;
      border: unset;
      /* margin-top: -10px; */
   }

   #profile-detail .modal-header button:hover, #profile-detail .modal-header button:focus, #profile-detail .modal-header button:active {
      border: 0px;
   }

   .reset-pass-img {
      height: auto;
      background-color: unset;
   }

   .reset-password .modal-content {
      border-top-right-radius: 20px;
   }

   .reset-title .line {
      width: 45px;
   }
}

@media only screen and (max-width: 576px) {
   .profile-phone-email .row {
      width: 60%;
      margin: 3rem auto;
   }

   .dropdown {
      height: auto;
      width: 100px;
      position: absolute;
      /* left: 280px !important;
      right: 0px; */
      text-align: right !important;
   }

   .navbar-brand {
      line-height: 0;
   }
}

@media only screen and (max-width: 480px) {

   .custom-btn {
  
      border-radius: 36px;
      font-size: 14px !important;
      padding: 5px 15px !important;
      
  }
   .main-menubar {
      padding: 0px 0px;
      /* z-index: 999; */
   }

   .navbar-toggler {
      /* position: absolute;
      right: 0px !important;
      top: 20px !important; */
   }

   .navbar-brand {
      line-height: 0;
   }

   .navbar-toggler:hover,
   .navbar-toggler:active,
   .navbar-toggler:focus {
      box-shadow: none;
   }

   .navbar-collapse {
      display: block;
      position: absolute;
      right: 0px;
      top: 0px;
      height: 100vh;
      z-index: 2;
   }

   .profile-phone-email .row {
      width: 100%;
      margin: 3rem auto;
   }

   .dropdown {
      position: absolute;
      /* left: 230px !important;
      right: 0px; */
      text-align: right !important;
   }

   .img-back-shadow {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 74px;
      height: 84px;
   }

   .img-back-shadow img {
      width: 55px;
      height: 55px;
   }

   .rounded-circle {
      margin-right: 0px;
      margin-top: 15px;
   }

   .navbar-brand img {
      width: 150px;
   }
}

@media only screen and (max-width: 365px) {

   .navbar-toggler {
      /* position: absolute;
      right: 0px !important;
      top: 20px !important; */
   }

   /* .dropdown {
      display: none;
   } */

   .navbar-brand img {
      width: 140px;
   }

   .profile {
      display: block !important;
   }
}






.hero-section {
   width: 100%;
   height: 555px;
}

.hero-section-round-1 {
   position: relative;
   left: -364px;
   top: 0px;
   height: auto;
}

.hero-section-shadow {
   position: absolute;
   right: -75px;
   top: 20px;
   height: 600px;
   width: 600px;
}

.main-slider {
   width: 100%;
   /* top: 0;
   height: 700px; */

}

.main-slider-img {
   /* width: 944px;
   height: 650px;
   right: 282px;
   position: relative;
   top: -150px;
   overflow: hidden; */

   width: auto;
   height: 613px;
   right: 250px;
   top: -150px;
   /* overflow: hidden; */
   /* width: 100%; */
   /* height: auto; */
   /* object-fit: cover; */
   position: relative;
}

.hero-slider .owl-carousel .owl-item img {
   display: block;
   overflow: hidden;
   position: absolute;
   height: 750px;
   width: auto;
}

.hero-section-round {
   position: absolute;
   left: 0px;
   right: 0px;
   overflow-x: hidden;
   top: 70px;
}

.main-slider-content {
   margin: 110px 0px 124px 116px;
   position: absolute;
   z-index: 9;
}

.main-slider-content h1 {
   font-family: 'antipasto pro';
   font-size: 4rem;
   line-height: 0.9;
   color: #130F40;
}

.main-slider-content h4 a {
   font-family: 'rubik';
   text-decoration: none;
   color: #30336b;
   font-weight: normal;
}

.book-now-main-slider {
   background-color: #130F40;
   color: #fff;
   font-family: 'antipasto pro';
   width: 195px;
   height: 50px;
   font-size: 22px;
   border-radius: 10px;
   margin-top: 70px;
}

.book-now-main-slider:hover,
.book-now-main-slider:active,
.book-now-main-slider:focus {
   background-color: #130F40;
   color: #fff;
   border-color: #130F40;
}

.hero-slider .owl-dots {
   display: none;

}



@media only screen and (max-width: 1200px) {
   .main-slider-img {
      right: 380px;
      overflow: unset;
   }
}

@media only screen and (max-width: 992px) {
   .hero-section {
      height: 625px;
   }

   .hero-section-shadow {
      /* right: 10px; */
   }

   .main-slider-img {
      /* width: 990px;
       */
      right: 490px;
   }

   .main-slider-content {
      margin: 110px 0px 124px 31px;
   }

   .main-slider-content h1 {
      font-size: 50px;
   }

}

@media only screen and (max-width: 767px) {
   .hero-section {
      height: 630px;
   }

   .main-slider-img {
      /* width: 1025px;
      */
      right: -30px;
   }

   .hero-slider .owl-carousel .owl-item img {
      height: 550px;
   }

   .main-slider-content {
      margin: -305px 0px 0px 31px;
   }

   .hero-section-shadow {
      /* right: 0px; */
      z-index: -1;
      width: 405px;
      height: 405px;
   }

   .car-img {
      display: none;
   }
}

.book-a-cab-detail {
   width: 100%;
   height: auto;
   display: flex;
   position: relative;
   overflow-x: hidden;
}

@media only screen and (max-width: 658px) {
   .hero-section {
      height: 630px;
   }

   .main-slider-img {
      /* right: -3px; */

   }

   .hero-slider .owl-carousel .owl-item img {
      height: 510px;
   }

   .main-slider-content {
      margin: -317px 0px 0px 31px;
   }

   .hero-section-round {
      left: -70px;

   }

   .hero-section-shadow {
      /* right: 5px; */
      width: 360px;
      height: 275px;
      /* top: -11px; */
   }

   .hero-section-round-1 {
      left: -326px;
      top: 0px;
      height: 590px;
   }
}

@media only screen and (max-width: 576px) {
   .main-slider-content h1 {
      font-size: 40px;
   }

   .hero-section {
      height: 600px;
   }

   .hero-section-round {
      left: -166px;
   }

   .hero-section-shadow {
      /* right: 12px; */
   }

   .hero-slider .owl-carousel .owl-item img {
      height: 400px;
   }

   .main-slider-img {
      /* right: -12px; */
      top: -100px;
   }

   .main-slider-content {
      margin: 275px 0px 0px 31px;
   }

   .hero-section-round-1 {
      left: -255px;
      top: 0px;
   }

}

@media only screen and (max-width: 480px) {
   .hero-section {
      height: 480px;
   }

   .main-slider-img {
      top: 0px;
      /* right: -20px; */
   }

   .hero-section-round {
      left: -104px !important;
   }

   .main-slider-content {
      margin: -390px auto 0px auto;
   }

   .hero-slider .owl-carousel .owl-item img {
      height: 330px;

   }

   .hero-section-round-1 {
      position: relative;
      left: -212px;
      top: 0px;
      height: 493px;
      width: auto;
   }

   .hero-section-shadow {
      position: absolute;
      /* right: 0px; */
      top: 0;
      width: 330px;
      height: 300px;
   }

   .main-slider .order-sm-first {
      order: 1 !important;
   }

   .main-slider .order-sm-last {
      order: 2 !important;
   }

   .main-slider-content {
      /* margin: -330px auto 0px auto; */
      text-align: justify;
      width: 100%;
      padding: 45px 25px 0px 25px;
   }

   .main-slider-content h1 {
      font-size: 30px;
   }

   .main-slider-content h4 a {
      font-size: 16px;
   }

   .book-now-main-slider {
      margin-top: 45px;
   }

   .book-now-main-slider {
      margin-top: 30px;
   }

   .book-now-main-slider {
      width: 155px;
      height: 44px;
      font-size: 20px;
   }
}

@media only screen and (max-width: 400px) {
   .hero-section {
      height: 430px;
   }

   .hero-section-round {
      left: -165px !important;
   }

   .hero-section-round-1 {
      left: -196px;
   }

   .main-slider-content h1 {
      font-size: 28px;
   }
}

@media only screen and (max-width: 365px) {
   .hero-section {
      height: 400px;
   }

   .hero-section-round-1 {
      top: 0px;
      left: -131px;
      height: 479px;
   }

   .hero-section-round {
      left: -215px;
   }

   .hero-section-shadow {
      /* right: 0px; */
      width: 250px;
      height: 180px;
   }

   .hero-slider .owl-carousel .owl-item img {
      height: 245px;
      /* right: 350px; */
   }

   .main-slider-content {
      margin: -442px auto 0px auto;
   }

   .book-now-main-slider {
      margin-top: 30px;
   }

   .book-now-main-slider {
      width: 140px;
      height: 40px;
      font-size: 20px;
   }
}

.book-cab-form {
   height: auto;
   display: flex;
   flex-direction: column;
   margin: -135px 50px 100px 111px;
   /* overflow-x: hidden; */
}

.book-cab-form h1 {
   font-family: 'Antipasto Pro';
   color: #130F40;
}

.book-for-label {
   width: 100%;
   display: inline-block;
}

.book-for-label label {
   font-family: 'Antipasto Pro';
   color: #130F40;
   font-size: 20px;
   margin-bottom: 0px;
}


.pickup-dropoff-address {
   position: relative;
   margin-top: 30px;
}

/* .effect-22:focus~label,
.has-content.effect-22~label {

   top: -18px;
   left: 0;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
} */

.pickup-dropoff-address .effect-22 {
   width: 100%;
   border: 0;
   padding: 9px 15px;
   border: 1px solid rgba(243, 243, 245, .7);
   position: relative;
   background: transparent;
   border-radius: 10px;
   background-color: rgba(243, 243, 245, .7);
   z-index: 1;
}

.pickup-dropoff-address .effect-22:active,
.pickup-dropoff-address .effect-22:focus {
   background-color: #fff;
   box-shadow: unset;
   border: 1px solid rgb(19, 15, 64, .7);
}


.pickup-dropoff-address .effect-22~label {
   position: absolute;
   left: 30px;
   width: 50%;
   top: 8px;
   color: #130F40;
   transition: 0.3s;
}

.pickup-dropoff-address .effect-22~label:active {
   z-index: -1;

}

.pickup-dropoff-address .effect-22:focus~label,
.has-content.effect-22~label {
   top: -18px;
   left: 21px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
   opacity: 1;
}

.pickup-dropoff-address .has-content.effect-22~label {
   top: -18px;
   left: 21px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
}

.btn-now {
   width: 100%;
   display: flex;
   justify-content: end;
}

.now {
   width: 100px;
   height: 40px;
   background-color: #F8F8FA !important;
   color: #130F40 !important;
   border-radius: 10px;
   font-size: 17px;
}

.book-later {
   transition: 0.3s;
}

.btn-now .btn {
   border: unset;
}

.btn-now .btn:hover, .btn-now .btn.focus, .btn-now .btn.active {
   background-color: #130F40 !important;
   color: #F8F8FA !important;
   border: none !important;
}

/* .btn-now .now:hover,
.btn-now .now:focus,
.btn-now .now:active,
.btn-now .now:target {
   background-color: #130F40;
   color: #F8F8FA;
   border: none;

} */

.book-cab-submit .btn {
   width: 165px;
   display: block;
   margin: auto;
   background-color: #130F41;
   color: #fff;
   font-size: 22px;
   border-radius: 10px;
   height: 47px;
   font-family: 'antipasto pro';
   border: unset;
}

.book-cab-submit .btn:hover, .book-cab-submit .btn:hover, .book-cab-submit .btn:hover {
   border: none;
   background-color: #130F41;
   color:#fff;
}

.vehicle-type {
   margin-top: 30px;

}

.vehicle-type-label {
   display: flex;
   justify-content: start;
}

.vehicle-type-label label {
   font-family: 'Antipasto Pro';
   color: #130F40;
   font-size: 20px;
}

.vehicle-type-select {
   display: flex;
   justify-content: end;
}

.vehicle-type-select select {

   width: 230px;
   height: 40px;
   background-image: url("../../assets/images/sort-down-solid.svg");
   background-size: 20px 16px;
   background-position-y: 7px;
   border-radius: 10px;
   color: #130F40;
}

.num-person {
   margin-top: 30px;

}

.num-person-label {
   display: flex;

}

.num-person-label label {
   font-family: 'Antipasto Pro';
   color: #130F40;
   font-size: 20px;

}

.num-person-input {
   display: flex;
}

.num-person-input .form-control {
   height: 40px;
   width: 110px;
   border-radius: 10px;
   display: inline;

   opacity: 1;
}

input[type='number']::-webkit-outer-spin-button {
   -webkit-appearance: none;
   appearance: none;
}


.num-person input[type=number]::-webkit-inner-spin-button {
   opacity: 1;
   background-image: url("../../assets/images/sort-down-solid.svg");
   background-size: 40px 16px;
   background-position-y: 7px;
}

.date-time {
   margin-top: 30px;
   animation: fadein 2s;

}

.date-time .date {
   width: 50%;
   display: inline;
   height: 40px;
   border-radius: 10px;
   margin-right: 10px;
   text-align: center;
}

@keyframes fadein {
   0% {
      opacity: 0;
   }

   50% {
      opacity: 0.5;
   }

   100% {
      opacity: 1;
   }
}

.date-time .time {
   width: 50%;
   display: inline;
   margin-left: 10px;
   height: 40px;
   border-radius: 10px;
   text-align: center;
}

.date-time label, .date-time1 label {
   font-family: 'Antipasto Pro';
   color: #130F40;
   font-size: 20px;
}



.cab-form-text-area {
   margin-top: 30px;

}

.cab-form-text-area textarea {
   border-radius: 15px;
}

.book-cab-form input:active,
.book-cab-form input:focus {
   box-shadow: none;
   border: 1px solid #30336b;
}

.book-cab-form textarea:active,
.book-cab-form textarea:focus {
   box-shadow: none;
   border: 1px solid #30336b;
}

.book-cab-form select:active,
.book-cab-form select:focus {
   box-shadow: none;
   border: 1px solid #30336b;
}

.book-cab-submit {
   margin-top: 30px;
}


.feet-img {
   width: 100%;
   height: 280px;
}

.feet-img img {
   position: absolute;
   right: -240px;
   z-index: 1;
   margin-top: 5px;
}

.car-img {
   width: 100%;
   height: 650px;
   position: relative;
}

.car-img img {
   position: absolute;

}

.car-img .round-shape {
   right: -300px;
}

.car-img .tesla-car-backimg {
   width: 102%;
   height: auto;
   margin-top: 145px;
   right: -25px;
}

@media only screen and (max-width: 1200px) {
   .date-time .date {
      width: 65%;
   }
}

@media only screen and (max-width: 992px) {
   .feet-img {
      display: none;
   }

   .book-cab-form {
      margin: 0px 20px 40px 20px;
      overflow-x: hidden;
   }

   .car-img .tesla-car-backimg {
      margin-top: 255px;
   }

   .car-img .round-shape {
      right: -385px !important;
   }

   .book-cab-form label {
      font-size: 18px;
   }

   .num-person-input .form-control {}

   .date-time .date {
      font-size: 14px;
   }

   .date-time .time {
      margin-left: 10px;
      font-size: 14px;
   }

}

@media only screen and (max-width: 840px) {
   .date-time .time {
      /* font-size: 12px; */
      padding: .375rem .48rem;
   }
}

@media only screen and (max-width: 767px) {
   .date-time .date {
      /* width: 75px; */
   }

   .num-person .num-person-input {
      /* padding-left: 60px; */
   }

   .now {
      width: 90px;
   }

   .date-time .time {
      margin-left: 10px;
      /* font-size: unset; */
   }

}

@media only screen and (max-width: 663px) {
   .num-person .num-person-input {
      /* padding-left: 27px; */
   }
}

@media only screen and (max-width: 630px) {
   .num-person .num-person-input {
      /* padding-left: 10px; */
   }
}

@media only screen and (max-width: 615px) {
   .num-person .num-person-input {
      /* padding-left: 0px; */
   }
}

@media only screen and (max-width: 575px) {
   .num-person .num-person-input {
      /* padding-left: 35px; */
   }

   .book-cab-form label {
      font-size: 16px;

   }

   .date-time .date {
      /* width: 70px; */
      /* margin-left: 10px; */
   }

   .date-time .time {
      /* margin-top: 5px; */
      margin-left: 10px;
   }
}

@media only screen and (max-width: 530px) and (max-width: 559px) {
   .num-person .num-person-input {
      /* padding-left: 10px; */
   }

   .date-time .date {
      /* margin-left: 10px; */
   }
}

@media only screen and (max-width: 480px) {
   .date-time .date {
      /* margin-left: 5px; */
   }

   .date-time .time {

      margin-left: 5px;
   }
}

@media only screen and (max-width:390px) {
   .book-for-label label {
      font-size: 16px;
   }

   .now {
      width: 70px;
   }

   .pickup-dropoff-address .effect-22~label {
      font-size: 14px;

   }

}

/* 
@media only screen and (max-width: 940px) {
   .vehicle-type .form-select {
      width: 225px;
   }
}

@media only screen and (max-width: 930px) {
   .btn-now {
      
   }

   .vehicle-type .form-select {
      width: 220px;
   }

   .date-time .date {
      width: 78px;
   }
}

@media only screen and (max-width: 925px) {
   .book-cab-form {
      margin: 0px 0px 40px 20px;
   }

   .btn-now { 
   }

   .vehicle-type .form-select {
      width: 205px;
   }

   .date-time .date {
      margin-left: 24px;
   }
}

@media only screen and (max-width: 915px) {
   .date-time .date {
      width: 78px;
   }
}

@media only screen and (max-width: 891px) {
   .vehicle-type .form-select {
      width: 182px;
   }

   .date-time .date {
      width: 82px;
   }

   .date-time .time {
      margin-left: 5px;
   }
}

@media only screen and (max-width: 845px) {
   .btn-now {
      
   }

   .vehicle-type .form-select {
      width: 155px;
   }
}

@media only screen and (max-width: 791px) {
   .vehicle-type select {
      margin-left: 71px;
   }
}

@media only screen and (max-width: 767px) {
   .vehicle-type .form-select {
      width: 190px;
      margin-left: 280px;
   }
}

@media only screen and (max-width: 756px) {
   .book-cab-form {
      margin: 40px 50px;
   }


   .vehicle-type select {
      width: 140px;
      margin-left: 145px;
   }

   .num-person .form-control {
      margin-left: 275px;
   }

   .date-time .date {
      margin-left: 235px;
   }
}

@media only screen and (max-width: 704px) {
   .book-cab-form {
      margin: 40px 20px;
   }

}

@media only screen and (max-width: 640px) {
   .vehicle-type select {
      width: 140px !important;
      margin-left: 235px !important;
   }
}

@media only screen and (max-width: 588px) {
   .book-cab-form {
      margin: 40px 10px;
   }


}

@media only screen and (max-width: 535px) {

   .vehicle-type select {
      width: 140px !important;
      margin-left: 235px !important;
   }
}

@media only screen and (max-width: 492px) {


}

@media only screen and (max-width: 450px) {

   .vehicle-type .form-select {
      width: 140px;
      margin-left: 130px;
   }
} */

.our-vehicles {
   width: 100%;
   height: 840px;
   background-image: url('../../assets/images/round.png');
   background-repeat: no-repeat;
   background-position: right -120px bottom;
   background-size: auto;
   z-index: 0;
}

.our-vehicle-heading {
   width: 100%;
   height: auto;
}

.our-vehicle-heading h1 {
   font-family: 'Antipasto Pro';
   color: #130F40;
   /* padding-left: 25px; */

}

.dots-line {
   height: 1px;
   width: 90%;
   background-color: #130F40;
   margin: -14px auto auto auto;
   z-index: -1;
   opacity: .5;
}

.car-features {
   width: 100%;
   height: auto;
   background-color: #fff;
   display: flex;
   flex-direction: column;
   border-radius: 10px;
   padding: 30px;
   box-shadow: rgb(48 51 107 / 10%) 7px 22px 19px -5px;
   margin-top: -30px;
}

.car-features span {
   padding-top: 20px;
   color: #b9c4cf;
   font-size: 18px;
}

.car-features h2 {
   font-size: 2rem;
   font-family: 'rubik';
   font-weight: 600;
   letter-spacing: 1px;
}

.car-features h4 {
   color: #130F40;

}

.car-features .line {
   width: 77px;
   height: 2px;
   background-color: #130F40;
   margin-bottom: 16px;

}

.car-features-col {
   display: flex;
   flex-direction: column;
   margin-top: 15px;
   width: 100%;
   height: auto;

}

.car-features-col .car-features-detail {
   width: 100%;
   height: 160px;
   background-color: #F4F4F6;
   display: flex;
   margin: 14px auto;
   border-radius: 10px;
}


/* .car-features-detail:hover {
   background-color: #130F40;
} */

.passanger {
   width: 100%;
   height: auto;
   font-family: 'Rubik', sans-serif;
   color: #3c3f80;
}

.passanger p {
   text-align: center;


}

.passanger:hover {

   color: #fff;
}


.tesla-dark-logo {
   width: 100%;
   height: auto;
   display: flex;
   justify-content: center;
   align-items: center;
}


.tesla-white {
   display: none;
}

.car-features-detail:hover {
   background-color: #30326B;
   border-radius: 10px;
}

.tesla-white {
   display: none;
}



/* 
.tesla-dark-logo :hover {
   display: none;
}

.tesla-dark-logo:hover .tesla-white {
   display: block;
} */

.rating {
   width: 100%;
   height: auto;
   font-family: 'Rubik', sans-serif;
   color: #3c3f80;
}

.rating p {

   text-align: center;

}

.rating:hover {
   color: #fff;
}

.mileage {
   width: 100%;
   height: auto;
   font-family: 'Rubik', sans-serif;
   color: #3c3f80;
}

.mileage p {
   text-align: center;


}


.mileage .mileage-space {
   margin-bottom: -1rem !important;
}

.mileage h3 {
   text-align: center;
}

.mileage:hover {
   color: #fff;
}

.slideshow {
   margin-top: 40px;

}

.slideshow .owl-prev,
.slideshow .owl-next {
   display: inline-block;
}

.slideshow .owl-next {
   float: right;
}

.slideshow .slider-counter {
   text-align: center;
}

.info {
   text-align: center;
   margin-top: 110px;
}

.slideshow .slides img {
   padding: 0px 90px;
}

.slideshow .owl-dot {
   margin: 0px 25px;
}

.slideshow button.owl-dot span {
   height: 15px;
   width: 15px;
   background-color: #CFCFD9;
   display: inline-block;
   border-radius: 50%;
   outline: 3px solid #fff;
}

.slideshow button.owl-dot.active span {
   height: 20px;
   width: 20px;
   background-color: #130F40;
   margin-top: 5px;
}

.slideshow button .owl-dot span {
   transition: all .2s ease !important;
}

.slideshow .owl-carousel .owl-nav.disabled {
   display: block !important;
}



.slideshow .owl-carousel .owl-nav button.owl-next {

   position: absolute !important;
   top: 25% !important;
   right: 0;
   font-size: 125px;
   font-weight: 100;
   display: inline-block;
   color: #b9c4cf;
}

.slideshow .owl-carousel .owl-nav button.owl-prev {

   position: absolute !important;
   top: 25% !important;
   left: 0;
   font-size: 125px;
   font-weight: 100;
   display: inline-block;
   color: #b9c4cf;
}

.slideshow .owl-carousel .owl-nav button.owl-prev:active,
.slideshow .owl-carousel .owl-nav button.owl-prev:hover {
   color: #130F40;
}

.slideshow .owl-carousel .owl-nav button.owl-next:active,
.slideshow .owl-carousel .owl-nav button.owl-next:hover {
   color: #130F40;
}

.slideshow .owl-item {
   background-color: transparent;
   padding: 50px 0px;
}

.slideshow .owl-dots {
   text-align: center;
   width: 390px;
   margin: 0 auto;
}

.owl-item {
   opacity: 0;
}

.owl-item.active {
   opacity: 1;
}

/* .owl-carousel .owl-animated-in.owl-animated-out {
   z-index: ;

}

.owl-carousel .owl-animated-in.active {
   z-index: 0;

} */

.slideshow #counter {
   margin-top: -35px;
   font-size: 18px;
   font-weight: bold;
   color: #130F40;
   font-family: 'rubik';
   margin-left: 50px;
}

.car-slider-dots {
   text-align: center;
   width: 100%;
   margin: 0 auto;
}

@media only screen and (max-width: 1200px) {
   .car-features-col .car-features-detail {
      width: 100%;

   }
}

@media only screen and (max-width: 992px) {
   .car-features span {
      padding-top: 55px;
   }  
   .our-vehicles {
      height:auto;
   }

   .slideshow {
      margin-left: 20px;
      /* margin-top: 135px; */
   }
.slideshow .slides img {
    padding: 0px 55px;
}

   .slideshow .owl-carousel .owl-nav button.owl-prev {
      top: 0 !important;
      left: 0;
   }

   .slideshow .owl-carousel .owl-nav button.owl-next {
      top: 0 !important;
      right:0;
   }

   .slideshow #counter {
      margin-left: 20px;
   }

   .car-features {
      /* margin: 30px 30px !important; */
      width: 100% !important;
      height: 525px;
      padding: 15px;
   }

   .car-features .line {
      margin-bottom: 0px;
   }

   .car-features-col {
      width: 100%;
      margin: 10px auto;
   }

   /* .car-features-col .car-features-detail {
      width: 85%;

   } */

   .slideshow .owl-item {
      padding: 0px;
   }

   .slideshow .owl-dots {
      width: 350px;
   }

   .slideshow button.owl-dot span {
      width: 15px;
      height: 15px;
      margin-top: -5px;
      background-color: #CFCFD9;
   }

   .slideshow button.owl-dot.active span {
      width: 20px;
      height: 20px;
      margin-top: 2px;
   }

   .dots-line {
      margin-top: -12px;
   }

}

@media only screen and (max-width: 767px) {

   .our-vehicles {
      height:auto;
   }

   .slideshow .owl-carousel .owl-nav button.owl-prev {
      top: 15% !important;
   }

   .slideshow .owl-carousel .owl-nav button.owl-next {
      top: 15% !important;
   }
}

@media only screen and (max-width: 755px) {
   .our-vehicles {
      height: auto;
   }

   .slideshow {
      margin-top: 0px;
   }

   .slideshow .slides img {
      padding: 0px 60px;
   }

   .slideshow .owl-carousel .owl-nav button.owl-prev {
      top: 15% !important;
      left: -7%;
   }

   .slideshow .owl-carousel .owl-nav button.owl-next {
      top: 15% !important;
      right: -7%;
   }

   .car-features {
      /* margin: 45px 20px !important; */
      margin: 0px auto !important;
      width: 87%;
      height: 525px;
      padding: 15px;
      margin-top: 50px !important;
   }

   .car-features-col .car-features-detail {
      /* width: 65%; */
      margin: 10px auto;
   }

   .car-features .line {
      margin-bottom: 0px;
   }

   .slideshow .owl-item {
      padding: 0px;
   }

   .slideshow .owl-dots {
      width: 350px;
   }

   .slideshow button.owl-dot span {
      width: 15px;
      height: 15px;
      margin-top: -5px;
      background-color: #CFCFD9;
   }

   .slideshow button.owl-dot.active span {
      width: 20px;
      height: 20px;
      margin-top: 2px;
   }

   .dots-line {
      margin-top: -12px;
   }

}

@media only screen and (max-width: 575px) {
   .our-vehicle-heading h1 {
      padding-left: 0px;
   }

   .slideshow .owl-carousel .owl-nav button.owl-next {
      right: 0%;
      top: 1% !important
   }

   .slideshow .owl-carousel .owl-nav button.owl-prev {
      left: 0%;
      top: 1% !important;
   }

   .car-features-col .car-features-detail {
      /* width: 65%; */
      margin: 10px auto;
   }

   .our-vehicles {
      height: auto;
      background-size: 100% auto;
   }

   .our-services {
      margin-top: 50px !important;
   }

   .our-services .owl-dot {
      margin: 12px 18px;
   }

   .our-services .owl-dot.active {
      margin: 17px 15px;
   }

   .car-features {
      width: 90% !important;
   }
}

@media only screen and (max-width: 480px) {
   .car-features {
      margin-top: 10px !important;
   }

   .car-features-col .car-features-detail {
      /* width: 75%; */
      margin: 10px auto;
   }

   .slideshow .owl-carousel .owl-nav button.owl-prev {
      top: -25% !important;
   }

   .slideshow .owl-carousel .owl-nav button.owl-next {
      top: -25% !important;
   }

   .slideshow .owl-dots, .car-slider-dots, #counter {
      display: none;
   }


}

@media only screen and (max-width: 350px) {
   .our-vehicles {
      height: auto;
   }

   .slideshow .owl-carousel .owl-nav button.owl-prev {
      top: -20% !important;
   }

   .slideshow .owl-carousel .owl-nav button.owl-next {
      top: -20% !important;
   }

}

.our-services {
   width: 100%;
   height: 820px;
   padding-top: 80px;
   background-image: url('../../assets/images/FLEET-light.png');
   background-repeat: no-repeat;
   background-position: left -80px bottom;
   background-size: auto;
   z-index: 1;
}

.our-services-heading {
   width: 100%;
   height: auto;
   padding-bottom: 0px;
}

.our-services-heading h1 {
   font-family: 'Antipasto Pro';
   color: #130F40;
}

.our-services .owl-carousel .owl-stage {
   animation: fadeOut linear infinite !important;

   /*animation: animation-name animation-duration animation-direction animation-iteration-count */

}

@keyframes fadeOut {
   0% {
      transform: translateX(10px);
   }

   100% {
      transform: translateX(-10px);
   }
}

.services-content {
   width: 120%;
   height: 100%;
   position: relative;
   margin-left: 10px;
   /* margin: 0px auto; */
   display: flex;
   align-items: center;
}

.services-1 {
   width: auto;
   height: 410px;
   background-color: #fff;
   border-radius: 15px;
   /* box-shadow: 0 0 50px #ccc; */
   box-shadow: rgba(48, 51, 107, 15%) 0px 2px 8px 0px;
   /* box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px; */
   position: absolute;
   /* top: 22%; */

}

.services-1-heading h3 {

   color: #130F40;
   padding-top: 20px;
   padding-left: 25px;
}

.services-1-truckimg img {
   right: 0;
   top: 0;
   width: auto !important;
   height: auto;
   float: right;
   margin-top: 25px;
   margin-right: 35px;
}

/* .owl-carousel .services-1-tucking {
   width: auto !important;
} */

.services-1 .line {
   width: 66px;
   height: 2px;
   background-color: #130F40;

   margin-left: 25px;

}

.services-1-img {
   width: 90%;
   height: auto;
   position: relative;
   z-index: -1;
   left: 0px;
}

.services-1-img img {
   right: 0;
   top: 0;
   width: auto;
   height: 555px;
   object-fit: cover;
}

.services-1-content {
   width: 100%;
   padding: 40px 30px;
}

.services-1-content p {
   font-size: 18px;
   font-family: 'rubik';
   font-weight: lighter;
   color: #130F40;
   letter-spacing: 1px;

}

.our-services .slider-counter {
   text-align: center;
}

.our-services .dots-line {
   height: 88%;
   width: 1px;
   background-color: #130F40;
   /* margin: -14px auto auto auto; */
   /* z-index: -1; */
   position: absolute;
   right: 15px;
   top: 15%
}

.our-services .owl-dots {
   align-items: center;
   /* margin: -420px 5px; */
   position: absolute;
   /* left: 422px; */
   right: -7px;
   width: auto;
   height: 100%;
   z-index: 999;
   display: flex;
   flex-direction: column;
   top: 0;
   justify-content: center;
}

.our-services .owl-dot {
   margin: 17px 0px;
}

.our-services .owl-dot.active {
   margin: 17px 0px;
}

.our-services button.owl-dot span {
   height: 15px;
   width: 15px;
   background-color: #CFCFD9;
   display: inline-block;
   border-radius: 50%;
   outline: 3px solid #fff;
}

.our-services button.owl-dot span {
   margin: 5px 0px;
}

.our-services button.owl-dot.active span {
   height: 20px;
   width: 20px;
   background-color: #130F40;
   margin: 3px 0px;

}

.our-services button .owl-dot span {
   transition: all .2s ease !important;
}

.counter-parent {
   width: 100%;
   position: relative;
   overflow: hidden;
}

#counter1 {
   padding-left: 96%;
   font-size: 18px;
   font-weight: bold;
   color: #130F40;
   position: absolute;
   right: 25px;
   margin-top: 31px;
   font-family: 'rubik';
}

@media only screen and (max-width: 1250px) {
   .car-features {
      width: 105%;
   }
}

@media only screen and (max-width: 1200px) {
   #counter1 {
      right: 35px;
   }

   .our-services .owl-dots {
      right: -5px;
   }

   .our-services .dots-line {
      right: 17px;
   }

   .services-1-content {
      padding: 0px 30px;
   }
   .services-1{
      height:325px;
   }
   .our-services 
   {
      height: 720px;
   }
}

@media only screen and (max-width: 1024px) {
   .our-services .dots-line {
      right: 17px;
   }
}

@media only screen and (max-width: 992px) {
   .our-services {
      padding-top: 50px;
      padding-left: 0px !important;
      height: 500px;
   }

   #counter1 {
      right: 20px;
   }

   .our-services .owl-dots {
      right: -6px;
   }
  
   /* .our-services .owl-dot.active {
      margin: 17px 22px;
   } */
   .our-services .dots-line {
      right: 16px;
   }
}

@media only screen and (max-width: 768px) {

   .our-services {
      height: 670px;
      display: block;
      padding-top: 10px;
      padding-left: 0px;
      margin-top: 85px !important;

   }
   .services-1{
      top:27%;
   }
   /* .our-services-heading h1{
      padding-left: 30px;
   } */
   #counter1 {
      display: none;
   }

   .services-1 {
      height: auto;
   }

   .services-1-img {
      margin: 0px auto;
   }

   .services-1-img img {
      height: 255px;
      left: 3px;
   }

   /* .our-services{
      margin-top: 0px !important;
   } */
   .our-services .dots-line {
      height: 46%;
      top: 11%;
      right: 12px;
   }

   .our-services .owl-dots {
      right: -8px;
      /* margin: -706px auto; */
      justify-content: start;
      top: 10%;
   }

   .our-services .owl-dot {
      margin: 12px 0px;
   }

   .our-services .owl-dot.active {
      margin: 17px 0px;
   }

   .services-1-truckimg img {
      width: 65px;
      margin-top: -35px;
   }

   .services-1-content {
      padding: 21px 20px;
   }

   .services-1-content p {
      font-size: 16px;
      letter-spacing: 0px;
      word-break: break-all;
   }

   .services-content {
      width: 85%;
      z-index: 1;
      height: 400px;
      position: relative;
      margin: -172px auto 0px auto;

   }

   .services-1-img img {
      height: 385px;
   }

   .our-services .order-sm-first {
      order: 1 !important;
   }

   .our-services .order-sm-last {
      order: 2 !important;
   }

   .our-services button.owl-dot.active span {
      height: 15px;
      width: 15px;
      background-color: #130F40;
      margin: 3px 0px;
   }

   .our-services button.owl-dot span {
      height: 12px;
      width: 12px;
   }
   .our-services .dots-line {
      height: 55%;
      top: 14%;
   }
}

@media only screen and (max-width:576px) {
   .services-1-img {
      width: 85%;
   }

   .our-services .owl-dots {
      right: 6px;
   }

   .our-services .dots-line {
      right: 26px;
   }

   .services-content {
      width: 80%;
   }

   .our-services {
      margin-top: 90px !important;
   }
}

@media only screen and (max-width:520px) {
   .our-services .dots-line {
      right: 25px;
   }

   .our-services .owl-dots {
      right: 5px;
   }
}

@media only screen and (max-width:480px) {
   .our-services {
      padding-top: 0px;
      height: 550px;
   }

   /* .our-services .dots-line {
      right: 27px;
   } */

   .our-services .owl-dots {
      right: 5px;
   }

   .our-services .owl-dot {
      margin: 12px 0px;
   }

   .our-services .owl-dot.active {
      margin: 17px 0px;
   }

   .our-services {
      margin-top: 40px !important;
   }

   .services-1-truckimg {
      display: none;
   }
   /* .our-services .dots-line {
      height: 65%;
      top: 16%;
  } */

  .our-services .dots-line, .our-services .owl-dots {
   display: none;
  }
}

@media only screen and (max-width:470px) {
   /* .our-services .dots-line {
      right: 25px;
   } */
}

@media only screen and (max-width:450px) {
   .our-services .owl-dot {
      margin: 12px 0px;
   }

   .our-services .owl-dot.active {
      margin: 17px 0px;
   }
}

@media only screen and (max-width:400px) {

   .our-services .owl-dot {
      margin: 12px 0px;
   }

   .our-services .owl-dot.active {
      margin: 17px 0px;
   }

   /* .our-services .owl-dots {
      margin: -699px auto;
   } */
}

@media only screen and (max-width:350px) {
   .our-services .owl-dot {
      margin: 12px 0px;
   }

   .our-services .owl-dot.active {
      margin: 17px 0px;
   }
}


/* {
   .our-services .owl-dot {
      margin: 12px 14px;
   }

   .our-services .owl-dot.active {
      margin: 17px 11px;
   }
} */

.testimonial {
   width: 100%;
   height: auto;
   display: flex;
   margin-top: 50px;
   margin-bottom: 150px;
}

.testimonial .owl-carousel {
   animation: fadeout linear infinite;
   /*animation: animation-name animation-duration animation-direction animation-iteration-count */

}

@keyframes fadeout {
   0% {
      transform: translateX(20px);
   }

   100% {
      transform: translateX(-20px);
   }
}

.testimonial-heading {
   width: 100%;
}

.testimonial-heading h1 {
   font-family: 'Antipasto Pro';
   color: #130F40;

}

.testimonials-imgs {
   width: 500px;
   height: 500px;
   line-height: 500px;
   text-align: center;
   border-radius: 50%;
   background-color: #F5F6F8;
   margin-top: 35px;
}

.testimonials-imgs img {
   display: inline-block;
   height: 300px;
   width: auto !important;
   border-radius: 50%;
   box-shadow: 0px 25px 51px #7b7e8b;

}

.testimonial-content {
   width: 95%;
   padding-top: 130px;
   padding-left: 60px;
}

.testimonial-content .line {
   width: 60px;
   height: 2px;
   background-color: #7b7e8b;
   margin-bottom: 16px;
}

.testimonial-content h2 {
   font-family: 'rubik';
   font-weight: bolder;
}

.testimonial-content p {
   font-size: 18px;
   font-family: 'rubik';
   padding-top: 40px;
   font-weight: lighter;
   color: #130F40;
   letter-spacing: 1px;
   line-height: 1.4;
}

.testimonial .owl-carousel .owl-item img {
   display: inline-block !important;
}

.testimonial .owl-dot {
   margin: 0px 30px;
}

.testimonial button.owl-dot span {
   height: 15px;
   width: 15px;
   background-color: #CFCFD9;
   display: inline-block;
   border-radius: 50%;
   outline: 3px solid #fff;
}

.testimonial button.owl-dot.active span {
   height: 20px;
   width: 20px;
   background-color: #130F40;
   margin-top: 5px;
}

.testimonial button .owl-dot span {
   transition: all .2s ease !important;
}

/* .testimonial .owl-item {
   background-color: transparent;
   padding: 50px 0px;
} */

.testimonial .owl-dots {
   display: block;
   text-align: center;
   width: auto;
   margin: 0 auto;
   position: absolute;
   /* margin-top: -120px; */
   display: flex;
   justify-content: center;
   right: 10%;
   bottom: 7%;
}

.testimonial-dots {
   /* text-align: center; */
   width: 100%;
   /* margin: 0 auto; */
   position: absolute;
   margin-top: 67px;
   right: 15%;
}

.testimonial-dots .dots-line {
   height: 2px;
   width: 39%;
   background-color: #CECED3;
   z-index: -1;
   position: absolute;
   margin-top: -121px;
   right: 0%;

}
@media only screen and (max-width:1400px) {
   .testimonial .owl-dots{
      right: 12%;
   }
   /* .testimonial .owl-dots{
      right: 3.5%;
   } */
}
@media only screen and (max-width:1200px) {
   .testimonials-imgs {
      width: 460px;
      height: 460px;
      line-height: 460px;
   }

   .testimonial-content {
      width: 100%;
      padding-top: 130px;
      padding-left: 110px;
   }

   .testimonial .owl-dots {
      right: 2%;
      bottom: -15px;
   }

   .testimonial .owl-dot {
      margin: 0px 27px;
   }

   .testimonial-dots {
      margin-top: 0px;
   }

   .testimonial-dots .dots-line {
      right: -7%;
      margin-top: 0px;
   }
}

@media only screen and (max-width:992px) {
   .testimonial {
      margin-top: 0px;
   }

   .testimonials-imgs {
      width: 320px;
      height: 320px;
      line-height: 320px;
      /* margin: auto; */
   }

   .testimonials-imgs img {
      height: 180px;
   }

   .testimonial-content {
      width: 100%;
      padding-top: 20px;
      padding-left: 0px;
   }

   .testimonial .owl-dots {
      right: 7%;
      bottom: 40px;
      margin-top: -150px;
   }

   .testimonial-dots .dots-line {
      right: -2%;
      width: 35%;
      /* margin-top: -194px; */
   }
   .testimonial .owl-dot {
      margin: 0px 15px;
  }
   .testimonial-content p {
      padding-top: 0px;
   }

   .testimonial-dots .dots-line {
      margin-top: -57px;
  }

   .testimonial {
      margin-bottom: 30px;
   }
}

@media only screen and (max-width:767px) {
   .testimonial .owl-dots {
      width: 100%;
      bottom: -33px;
   }
   .testimonial-content h2{
      font-size: 18px;
   }
   .testimonial {
      margin-bottom: 100px;
      /* padding: 0px 20px; */
      margin-top: 20px;
   }

   .testimonial-heading {
      margin-bottom: 25px;
   }

   .testimonial .owl-dots {
      margin-top: 0px;
      right: 0%;
   }

   .testimonial-dots .dots-line {
      right: 0%;
      margin-top: 16px;
      width: 70%;
   }

   .testimonials-imgs {
      margin: 0px auto;
   }

   .testimonial-content p {
      font-size: 16px;
      letter-spacing: 0;
      word-break: break-all;
   }
}

@media only screen and (max-width:480px) {
   .testimonials-imgs {
      width: 295px;
      height: 295px;
      line-height: 295px;

   }

   .testimonials-imgs img {
      height: 180px;
   }

   /* .testimonial-dots .dots-line {
    width: 70%;
 } */

 .testimonial-dots .dots-line, .testimonial .owl-dots {
   display: none;
 }

}

footer {
   width: 100%;
   height: auto;
   /* margin-top: 150px; */
   background-color: #F8F8FA;
}

.footer_logo {
   position: relative;
   width: 100%;
   margin: auto;
   display: flex;
}

.footer_logo img {
   margin: 0 auto;
   width: 100px;
   height: 140px;
}

.footer_logo_img {
   width: 100%;
   margin: auto;
   display: flex;
   top: 43px;
}

.footer_logo_img img {
   width: 50px;
   height: auto;
}

.footer-menu {
   width: 100%;
   display: flex;
   justify-content: center;

}

.footer-menu ul {
   display: flex;
   list-style-type: none;
   padding: 0;
   margin: 0;
   justify-content: center;
   align-items: center;
}

.footer-menu ul li {
   padding: 20px 40px;
   transition: background-color 0.3s ease;
   display: inline-block;
   font-size: 0;
}

.footer-menu ul li a {
   font-size: 18px;
   font-family: 'rubik';
   font-weight: lighter;
   text-decoration: none;
   color: #30336b;
   letter-spacing: 1px;
   display: inline-block;
   text-align: center;
}

/* .footer-menu li a:hover {
   font-weight:bold;
}

.footer-menu li a::before {
   display: block;
   content: attr(title);
   font-weight: bold;
   height: 0;
   overflow: hidden;
   visibility: hidden;
} */
.footer-menu li {
   display: inline-block;
   font-size: 0;
}

.footer-menu li a {
   display: inline-block;
   text-align: center;
   /* font: normal 16px Arial; */
   /* text-transform: uppercase; */
}

.footer-menu a:hover {
   font-weight: bold;
}

/* The pseudo element has the same content and hover style, so it pre-sets the width of the element and visibility: hidden hides the pseudo element from actual view. */
.footer-menu a::before {
   display: block;
   content: attr(title);
   font-weight: bold;
   height: 0;
   overflow: hidden;
   visibility: hidden;
}

/* .footer-menu ul li a:hover,
.footer-menu ul li a:active,
.footer-menu ul li a:focus {
   color: #30336b;
   font-weight: bold;
} */

.social-icon {
   width: 100%;
   display: flex;
   justify-content: center;
   margin-bottom: 10px;
}

.social-icon-background {
   position: relative;
   margin: 30px 25px;
   border-radius: 50%;
}

.social-icon-background a {
   background-color: #CBC9D6;
   width: 30px !important;
   height: 30px !important;
   line-height: 30px;
   text-align: center;
   display: block;
   border-radius: 50%;
}

.social-icon-background a:active,
.social-icon-background a:hover {
   background-color: #130F40;
}

.social-icon-background a i {
   font-size: 16px;
   color: #fff;
}

.social-icon-background:hover {
   background-color: #130F40;
   box-shadow: rgb(48 51 107 / 20%) 3px 18px 19px -5px;
}

.copyright {
   width: 100%;
   margin-bottom: 5px;
}

.copyright p {
   text-align: center;
   color: #30336b;
   font-size: 14px;
}

@media only screen and (max-width:992px) {
   .footer-menu ul li {
      padding: 20px 40px;
   }
}

@media only screen and (max-width:767px) {
   .footer-menu ul li {
      padding: 20px 20px;
   }

   .footer-menu ul li a {
      font-size: 16px;
   }
}

@media only screen and (max-width:480px) {
   .footer-menu ul li {
      padding: 20px 10px;
   }

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

/* about page css */
.about-us-menubar .navbar-toggler[aria-expanded="true"] {
   color: #ffffff !important;
}


.img-back-shadow1 {
   background-color: #130F41;
   width: 100px;
   height: 113px;
   border-bottom-left-radius: 50px;
   border-bottom-right-radius: 50px;
   margin-top: -15px;
}

.img-back-shadow1 img {
   width: 70px;
   height: 70px;
}

.rounded-circle1 {
   margin-right: 15px;
   margin-top: 30px;
   /* border: 1px solid #fff; */
   /* box-shadow: rgb(48 51 107 / 10%) 0px 10px 15px 1px, rgb(48 51 107 / 5%) 0px 4px 6px -1px; */
   border-radius: 50%;
}

.about-hero-section-round {
   width: 100%;
   height: auto;

}

.about-hero-section-round img {
   width: auto;
   max-height: 100%;
   position: relative;
   left: -280px;
}

/* .about-hero-section {
   width: 100%;
   position: relative;
   display: flex;

}

.about-hero-section-round {
   width: 100%;

}

.about-hero-section-round img {
   position: relative;
   left: -270px;
   height: 570px;
   width: auto;
}

.about-hero-section-round-fleet {
   width: 100%;
   bottom: 0px;
   right: -190px;
   overflow-x: hidden;
}

.about-hero-section-round-fleet img {
   position: relative;
   z-index: -1;
   width: auto;
   height: 100%;
} */

.about-hero-section {
   width: 100%;
   display: flex;
   position: relative;

}

/* .about-hero-section-round {
   width: 100%;
   height: auto;
   position: relative;
   left: -270px;
} */

/* .about-hero-section-round img {
   width: 100%;
   height: auto;
} */
/* 
.about-hero-section-round-fleet {
   width: 100%;
   height: 700px;
   position: relative;
} */

/* .about-hero-section-round-fleet img {
   width: 600px;
   height: auto;

} */

.about-section {
   width: 100%;
   height: auto;
}

.about-section .display-4 {
   font-family: 'antipasto pro';
   font-weight: 600;
   margin-top: 130px;
   margin-left: 8px;
   font-size: 3.8rem;
   line-height: 1.3;
}

.about-hero-section-content {
   width: 100%;
   position: absolute;
}

.about-hero-img img {
   width: auto;
   max-height: 450px;
   position: absolute;
   top: 25px;
   right: 0px;
}

@media only screen and (max-width:1200px) {
   .about-hero-img img {
      height: 350px;
   }

   .navbar-nav li {
      padding: 0px 35px 0px 35px;
   }
}

@media only screen and (max-width:1120px) {
   .navbar-nav li {
      padding: 0px 20px 0px 20px;
   }
}

@media only screen and (max-width:1070px) {
   .about-hero-img img {
      width: 480px;
   }
}

@media only screen and (max-width:992px) {
   .navbar-collapse {
      width: 100%;
      z-index: 2;
      background-color: rgba(19, 15, 65, 0.7);
      /* background-color: rgba(48, 51, 107, 0.7); */
   }

   .navbar-nav {
      text-align: center;
      height: 100vh;
      position: relative;
      margin-top: 20px;
   }

   /* .navbar-nav .nav-link.sign-up-res{
      position:absolute;
      bottom: 150px;
      width: 100%;
      text-align: center;
   } */
   .navbar-nav .nav-link {
      font-weight: lighter;

   }

   .nav-link:focus, .nav-link:hover {
      color: #fff;
      font-weight: bold;
   }

   .navbar-nav .nav-link.active {
      color: #fff !important;
      font-weight: bold;
   }

   .navbar-nav li {
      padding: 10px 20px 10px 20px;
   }

   .navbar-nav li a {
      color: #fff;
      padding-left: 0px;
   }

   /* .main-section-background{
      height:
   } */
   .about-hero-img img {
      width: 60%;
      height: auto;
      right: 0;
      top: auto;
   }

   .about-hero-section-round {
      width: 100%;
      height: auto;
   }

   .about-hero-section {
      overflow-x: hidden;
   }

   .main-section-background {
      background-size: 19% 700px;
   }

   .about-hero-section-fleet {
      right: auto;
      bottom: 0;
   }
}

@media only screen and (max-width:768px) {

   .main-section-background {
      background-size: 18% 700px;
   }

   /* .about-hero-section-round img {
      left: -340px;
   } */
   .about-section{
      width: 80%;
   }
   .about-section .display-4 {
      margin-left: 0px;
   }
}

@media only screen and (max-width:576px) {
   .main-section-background {
      background-size: 19% 650px;
   }

   /* .about-hero-section-round img {
      left: -340px;
   } */

   .about-section .display-4 {
      margin-left: 50px;
   }
}

@media only screen and (max-width:480px) {
   .main-section-background {
      background-size: 19% 450px;
      /* height: 450px; */
   }

   .about-hero-section-round-fleet {
      top: -47px !important;
      right: 0px;
   }

   /* .about-hero-section-round img {
      left: -265px;
   } */
   .img-back-shadow1 {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 74px;
      height: 84px;
   }

   .img-back-shadow1 img {
      width: 55px;
      height: 55px;
   }

   .rounded-circle1 {
      margin-right: 0px;
      margin-top: 15px;
   }
}

@media only screen and (max-width:360px) {
   .main-section-background {
      background-size: 19% 400px;
      /* height: 400px !important; */
   }

   .section-round img {
      width: 66%;
      left: -173px;
   }

   .about-section .display-4 {
      margin-left: 30px;
      margin-top: 88px;
   }
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link:focus, .navbar-nav .nav-link:hover, .navbar-nav .nav-link:active {
   color: #130F40;
   font-weight: bold;
}

.custom-toggler.navbar-toggler-icon {
   background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, .8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
   /* z-index: 99; */
}

   /* .navbar-toggler .custom-toggler .navbar-toggler-icon {
      border-color: rgb(255, 255, 255);
   } */

/* .about-hero-section-round-fleet {
   width: 100%;
   position: relative;
   height: 100%; */
/* background-image: url('../images/FLEET1.png');
   background-repeat: no-repeat;
   background-position: right -100px bottom 0px;
 } */

/* .about-hero-section-round-fleet img {
   width: 100%;
   height: auto;
   position: absolute;
   bottom: 0px;
} */
.about-fleet-manager {
   width: 100%;
   /* height: 500px; */
   position: relative;
   margin-top: -80px;
   margin-bottom: 100px;
}

.about-fleet-manager-image {
   width: 100%;
   height: auto;
}

.about-fleet-manager-image:before {
   width: 22%;
   height: 100px;
   content: '';
   /* position: relative;
   left: -5px; */
   margin-top: -35px;
   background-color: #30326B;
   border-top-right-radius: 10px;
   position: absolute;
   left: 0px;
   z-index: -1;
}

.about-fleet-manager-image img {
   width: 40%;
   height: auto;
   position: absolute;
   border-radius: 10px;
   left: -132px;
   object-fit: cover;
}

.about-fleet-manager-content {
   padding: 0px 30px;

}

.about-fleet-manager-content h2 {
   font-family: 'rubik';
   font-weight: bold;
}

.about-fleet-manager-content p {
   font-family: "rubik";
   font-size: 18px;
   letter-spacing: 1.1px;
   color: #4F4D5A;
   font-weight: lighter;
   margin-top: 40px;
   line-height: 1.3;

}

.about-fleet-manager-content1 p {
   font-family: "rubik";
   font-size: 18px;
   letter-spacing: 1.1px;
   color: #4F4D5A;
   font-weight: lighter;
   line-height: 1.3;

}

.about-fleet-manager-content .line {
   width: 77px;
   height: 3px;
   background-color: #130F40;
   margin-left: 0px;
   margin-top: 15px;
}

@media only screen and (max-width:992px) {
   .about-fleet-manager-image img {
      /* width: 50%; */
      height: auto;
   }

   .about-fleet-manager-content {
      /* margin-top: 2rem !important; */
      padding: 0rem;
   }

   .about-fleet-manager-content p {
      margin-top: 20px;
   }

   .about-fleet-manager {
      padding-bottom: 50px;
      /* height: 480px; */
   }
   .navbar-nav .nav-link.active, .navbar-nav .nav-link:focus, .navbar-nav .nav-link:hover, .navbar-nav .nav-link:active{
      color: #fff;
   }
   .services-1{
      height: auto   ;
   }
}

@media only screen and (max-width:768px) {
   .about-fleet-manager {
      margin-bottom: 0px;
      /* height: 460px; */
   }

   .about-fleet-manager-content {
      padding: 0px;
   }

   .about-fleet-manager-content p {
      /* letter-spacing: 0px;
      font-size: 16px;
      line-height: 1.2;
      margin-top: 10px; */
   }

   .about-fleet-manager-content {
      /* margin-top: 1rem !important; */
   }

   .about-fleet-manager-image img {
      position: static;
   }
}

@media only screen and (max-width:576px) {
   .about-fleet-manager {
      margin-bottom: 0px;
      height: auto;
   }

   .about-fleet-manager-image img {
      width: 55%;
   }

   .about-fleet-manager-content p {
      letter-spacing: 0px;
      font-size: 16px;
      line-height: 1.2;
      margin-top: 10px;
   }
}

@media only screen and (max-width:480px) {
   .about-fleet-manager-image img {
      width: 62%;
   }

   .about-fleet-manager-image:before {
      width: 100px;
      margin-top: -25px;
   }
}

.servey {
   display: flex;
   width: 100%;
   height: auto;

}

.city-servey {
   box-shadow: rgba(245, 245, 247, 1) 0px 10px 15px 1px, rgba(249, 249, 249, 1)0px 4px 6px -1px;
   width: auto;
   height: 100%;
   border-radius: 10px;
   position: relative;
   left: 0px;
   background-color: #f8f8fa;
}

.city-servey-img {
   display: flex;
   justify-content: flex-end;
   border-bottom-left-radius: 50%;
   width: 100%;
   height: auto;
}

.city-servey-img img {
   box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
   border-bottom-left-radius: 50%;
   width: 65%;
   height: auto;
}

.count-servey {
   width: 50%;
   height: auto;
   padding: 10px;
   position: absolute;
   background-color: #30326B;
   top: 122px;
   left: 58px;
   text-align: center;
   border-radius: 10px;

}

.count-servey h3 {

   color: #fff;
   font-weight: bold;
   font-family: 'rubik';
   font-size: 2rem;
   margin-bottom: 0rem;
}

.city-servey-content {
   width: 100%;
   text-align: center;
   padding: 40px;
   margin-top: 35px;
}

.city-servey-content h2 {
   font-family: 'rubik';
   font-weight: lighter;
   color: #13103B;
}

.vehicle-servey {
   box-shadow: rgba(245, 245, 247, 1) 0px 10px 15px 1px, rgba(249, 249, 249, 1)0px 4px 6px -1px;
   width: auto;
   height: 100%;
   border-radius: 10px;
   position: relative;
   right: 0px;
   background-color: #f8f8fa;
}

.vehicle-servey-img {
   display: flex;
   justify-content: flex-start;
   border-bottom-left-radius: 50%;
   width: 100%;
   height: auto;
}

.vehicle-servey-img img {
   box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
   border-bottom-right-radius: 50%;
   width: 65%;
   height: auto;
}

.vehicle-count-servey {
   width: 50%;
   height: auto;
   padding: 10px;
   position: absolute;
   background-color: #30326B;
   top: 122px;
   right: 58px;
   text-align: center;
   border-radius: 10px;
}

.vehicle-count-servey h3 {
   color: #fff;
   font-weight: bold;
   font-family: 'rubik';
   font-size: 2rem;
   margin-bottom: 0rem;
}

.vehicle-servey-content {
   width: 100%;
   text-align: center;
   padding: 40px;
   margin-top: 35px;
}

.vehicle-servey-content h2 {
   font-family: 'rubik';
   font-weight: lighter;
   color: #13103B;
}

.minds-behind-fleet-manager {
   width: 100%;
   height: auto;
   display: flex;
   margin-top: 100px;
   position: relative;
   margin-top: 150px;
   margin-bottom: 100px;
}

.minds-behind-title {
   width: 100%;
}

.minds-behind-title h1 {
   font-family: 'antipasto pro';
   color: #130F40;
   font-weight: 600;
}

.client-1 {
   width: 100%;
   display: flex;
   position: relative;

}

.client-1-img {
   width: 100%;
   height: auto;
   position: relative;
   border-radius: 50%;
   margin-top: 100px;

}

.client-1-img:before {
   width: 58%;
   height: 75%;
   content: '';
   background-color: #130F41;
   position: absolute;
   top: -20px;

   border-radius: 50px;

}

.client-1-img img {
   position: relative;
   right: 0px;
   display: flex;
   margin: 0px auto;
   box-shadow: rgb(0 0 0 / 29%) 0px 19px 54px;
   border-radius: 50%;
   width: 65%;
   height: auto;
}

.client-1-content {
   width: 100%;
   vertical-align: middle;
   position: relative;
   margin-top: 100px;
}

.client-1-content h2 {
   font-family: 'rubik';
   font-weight: bold;
}

.client-1-content-res {
   width: 100%;
   vertical-align: middle;
   position: relative;
   margin-top: 100px;
}

.client-1-content-res h2 {
   font-family: 'rubik';
   font-weight: bold;
}

.client-1-content-res .line-owner .line span {
   top: 24px;
}

.line-owner {
   display: flex;
   flex-direction: row;
}

.client-1-content .line-owner .line {
   width: 40px;
   height: 3px;
   background-color: #130F40;
   margin-top: 8px;
}

.client-1-content .line-owner span {
   top: 37px;
   position: absolute;
   left: 50px;
   font-size: 20px;
   color: #C1CAD1;
   font-weight: lighter;
}

.client-1-description {
   width: 100%;
   margin-top: 35px;
}

.client-1-description p {
   font-size: 19px;
   font-family: 'rubik';
   color: #434252;
   font-weight: lighter;
   text-align: justify;
   line-height: 1.2;
}

.client-2-content {
   width: 100%;
   vertical-align: middle;
   position: relative;
   margin-top: 100px;
}

.client-1-content h2 {
   font-family: 'rubik';
   font-weight: bold;
}

.client-2-content .line-owner2 {
   display: flex;
   /* flex-direction: row; */
   justify-content: end;

}

.client-2-content .line-owner2 .line {
   width: 40px;
   height: 3px;
   background-color: #130F40;
   margin-top: 5px;
}

.client-2-content .line-owner2 span {
   top: 33px;
   position: absolute;
   right: 50px;
   font-size: 20px;
   color: #C1CAD1;
   font-weight: lighter;
   display: flex;
   justify-content: end;
}


.client-2-content .client-2-description p {
   font-size: 19px;
   font-family: 'rubik';
   color: #434252;
   font-weight: lighter;
   text-align: end;
   margin-top: 35px;
   line-height: 1.2;
}

.client-2 {
   width: 100%;
   display: flex;
   position: relative;
}

.client-2-img {
   width: 100%;
   height: auto;
   position: relative;
   border-radius: 50%;
   margin-top: 100px;

}

.client-2-img:before {
   width: 58%;
   height: 75%;
   content: '';
   background-color: #130F41;
   position: absolute;
   top: -20px;
   right: 0px;
   border-radius: 50px;

}

.client-2-img img {
   position: relative;
   width: 65%;
   height: auto;
   display: flex;
   margin: 0px auto;
   box-shadow: rgb(0 0 0 / 29%) 0px 19px 54px;
   border-radius: 50%;
}

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

.user_profile_img img {
   width: 65px;
   height: 65px;
   position: absolute;
   margin: 10px 0px 10px 18px;
   outline: 3px solid #fff;
   border-radius: 50%;
   /* box-shadow: rgba(196, 195, 208, .6) 0px 8px 24px; */
   /* box-shadow: rgba(196, 195, 208, .6) 0px 7px 29px 0px; */
   /* box-shadow: rgba(19, 15, 64, .6) 0px 5px 15px; */
   box-shadow: rgb(19 15 64 / 29%) 0px 3px 25px 2px;
}


.booking-history-title {
   width: 100%;
   height: 100px;
   background-color: #fbfbfb;

}

/*
.responsive-mind-behind-fm{
   width:100%;
   height: auto;

}
.res-mind-img{
   width: 100%;
   height: auto;
}
.client-1-img-res {
   width: 100%;
   height: auto;
   position: relative;
   border-radius: 50%;
   margin-top: 100px;
}
.client-1-img-res:before{
   width: 45%;
   height: 89%;
   content: '';
   background-color: #130F41;
   position: absolute;
   top: -20px;
   border-radius: 20px;
   
}
.client-1-img-res img
{
 width: 45%;  
 position: relative;
 right: 0px;
 display: flex;
 margin: 0px 20px;
 box-shadow: rgb(0 0 0 / 29%) 0px 19px 54px;
 border-radius: 50%;
 height: auto;

}
.client-1-content-paragraph-res p{
   font-size: 18px;
   font-family: 'rubik';
   color: #434252;
   font-weight: lighter;
   text-align: start;
   margin-top: 15px;
   line-height: 1.2;
   padding: 20px;
}
.client-2-content-res{
   width: 100%;
   height: auto;
   position: relative;
   border-radius: 50%;
   margin-top: 100px;
}
.client-2-img-res
{
   width: 100%;
   height: auto;
   position: relative;
   border-radius: 50%;
   margin-top: 70px;
}
.client-2-img-res:before{
   width: 45%;
   height: 89%;
   content: '';
   background-color: #130F41;
   position: absolute;
   top: -20px;
   border-radius: 20px;
   right: 25px;
}
.client-2-img-res img
{
 width: 45%;  
 position: relative;
 right: 0px;
 display: flex;
 margin: 0px 0px;
 box-shadow: rgb(0 0 0 / 29%) 0px 19px 54px;
 border-radius: 50%;
 height: auto;
left: 80px;
}
.client-2-content-paragraph-res p{
   font-size: 18px;
   font-family: 'rubik';
   color: #434252;
   font-weight: lighter;
   text-align: start;
   margin-top: 15px;
   line-height: 1.2;
   padding: 20px;
}
.client-2-content-res .line-owner .line span{
   top: 26px;
} */
@media only screen and (max-width:992px) {
   .vehicle-servey-content {
      padding: 15px;
   }

   .city-servey-content {
      padding: 15px;
   }

   .booking-history-title {
      margin-top: 10px;
   }

   .minds-behind-fleet-manager {
      padding-right: 0px;
      padding-left: 0px;
      /* display: none; */
   }

   .city-servey {
      margin: 0px auto;
   }

   .vehicle-servey {
      margin: 0px auto;
   }

   .vehicle-servey-img {
      border-bottom-left-radius: 100%;
   }

   .vehicle-servey-img img {
      border-bottom-right-radius: 100%;
   }

   .city-servey-img {
      border-bottom-left-radius: 100%;
   }

   .city-servey-img img {
      border-bottom-left-radius: 100%;
   }

   .vehicle-count-servey {
      width: 50%;
      height: auto;
      padding: 10px;
      position: absolute;
      background-color: #30326B;
      top: 122px;
      left: 95px;
      text-align: center;
      border-radius: 10px;
   }

   .minds {
      /* display: none; */
   }

   .count-servey {
      padding: 6px;
      top: 93px;
   }

   .count-servey h3 {
      font-size: 1.4rem;
   }

   .vehicle-count-servey {
      padding: 6px;
      top: 93px;
   }

   .vehicle-count-servey h3 {
      font-size: 1.4rem;
   }
}

@media only screen and (max-width:767px) {
   .vehicle-count-servey {
      left: 145px;
   }

   .vehicle-servey {
      /* top:50px; */
   }

   .client-2-img-res:before {
      right: 0px;
   }

   .count-servey {
      padding: 10px;
      top: 122px;
   }

   .count-servey h3 {
      font-size: 2rem;
   }

   .vehicle-count-servey {
      padding: 10px;
      top: 122px;
   }

   .vehicle-count-servey h3 {
      font-size: 2rem;
   }
}

@media only screen and (max-width:480px) {
   .vehicle-count-servey {
      left: 80px;
   }

   .client-1-content-res h2 {
      font-size: 1.2rem;
   }

   .client-1-content-res .line-owner .line span {
      top: 19px;
      font-size: 16px;
   }
}

/*.............booking-history page css...............*/

.booking-history-round {
   width: 100%;
   height: 500px;
   position: absolute;
   z-index: 0;
}

.booking-history-round img {
   width: 25%;
   height: auto;
   position: relative;
   left: -140px;
}

.history-title {
   display: flex;
   height: 100px;
   width: 100%;
   align-items: center;
   position: relative;
}

.history-title h2 {
   font-family: 'antipasto pro';
   font-weight: 300;
   letter-spacing: 1px;
   align-items: center;
   color: #130f40;
   padding-left: 12px;
   letter-spacing: 0px;
}

.booking-history-details {
   width: 100%;
   height: auto;
   display: flex;
   flex-direction: column;
   margin-top: 100px;
   position: relative;
}

.booking-history-details2 {
   width: 100%;
   height: auto;
   display: flex;
   flex-direction: column;
   margin-top: 10px;
   position: relative;
   display: none;
   margin-bottom: 100px;
}

.booking-history-bg {
   width: 100%;
   height: auto;
   border-radius: 10px;
   background-color: #fff;
   /* box-shadow: rgb(19 15 64 / 29%) 0px 3px 25px 2px;   */
   box-shadow: rgb(19 15 65 / 8%) 0px 7px 18px;
   display: flex;
   flex-direction: row;

}

.booking-history-bg-blue-img {
   width: 8rem;
   height: 40px;
   background-color: #130f40;
   top: 0px;
   left: 0px;
   position: relative;
   border-top-left-radius: 15px;
   border-bottom-right-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.booking-history-bg-blue-img span{
    color: #fff;
 }


.address-detail {
   width: 100%;
   height: auto;

}

.from-add {
   width: 100%;
   height: auto;
   display: flex;
   flex-direction: row;
}

.from-to-address {
   width: 100%;
   margin-top: 3rem;
   margin-left: 2rem;
}

.from-add h5 {
   /* width: 13%; */
   padding: 1px 0px;
   font-family: "rubik";
  font-size: 18px;
  font-weight: bold;
}
.from {
   margin-right: 25px;
}

.from-add p {
   font-family: 'rubik';
   color: #151422;
   font-size: 17px;
   font-weight: 100;
}

.rent-hour {
   width: 100%;
   position: relative;
}

.rent {
   width: 65%;
   background-color: #f2f2f4;
   position: absolute;
   right: 0px;
   border-top-left-radius: 10px;
   border-bottom-left-radius: 10px;
}

.rent h5 {
   padding: 20px 0px 20px 30px;
   margin-bottom: 0px;
   color: #151134;
}

.hour {
   background-color: #130F40;
   position: absolute;
   right: 0px;
   height: auto;
   color: #fff;
   padding: 20px;
   top: -10px;
   border-top-left-radius: 10px;
   border-bottom-left-radius: 10px;
   line-height: 1.1;
}

.hour .km {
   text-align: center;
   font-family: 'rubik';
   font-weight: bold;
   font-size: 18px;
   margin-bottom: 0px;
}

.hour .hour-detail {
   color: #9F9DB9;
   font-family: 'rubik';
   margin-bottom: 0px;
   font-size: 18px;
   letter-spacing: -1px;
}

.b-h-date {
   width: 150px;
   height: auto;
   background-color: #9F9DB9;
}

.booking-history-date {
   display: flex;
   justify-content: end;
   margin-top: 20px;
}

.b-h-date {
   width: 130px;
   height: auto;
   background-color: #F2F2F4;
   padding: 2px;
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
}

.b-h-date p {
   margin-bottom: 0px;
   text-align: center;
   font-family: 'rubik';
   color: #44405C;
}

.last-div-effect {
   width: 100%;
   height: 150px;
}

.scroll-arrow {
   width: 100%;
   height: auto;
   background: rgba(255, 255, 255, .8);
   padding: 158px 0px;
   z-index: 1;
   position: absolute;
   bottom: 0px;
   text-align: center;

}

.scroll-arrow a i {
   font-size: 30px;
   color: #e4e2e2;
   position: absolute;
   bottom: -20px;
}

.scroll-arrow a:hover i{
   
   color: #30336b;
  
}

@media only screen and (max-width:1400px) {
   .rent {
      width: 80%;
   }
}

/* @media only screen and (max-width:1400px){
   .rent{
      width: 90%;
   }
 } */
@media only screen and (max-width:992px) {
   .booking-history-details2 {
      display: none;
   }

   .booking-history-details {
      margin-top: 50px;
   }

   .from-to-address {
      margin-top: 1rem;

   }

   .rent {
      width: 50%;
      position: unset;
      float: right;
      border-top-left-radius: unset;
      border-bottom-left-radius: unset;
      margin-top: -16px;
      border-top-right-radius: 10px;
   }

   .rent h5 {
      padding: 30px 0px 30px 0px;
      text-align: center;
   }

   .hour {
      position: absolute;
      float: right;
      /* bottom: 0px; */
      top: auto;
      /* padding: 27px 0px; */
      border-bottom-left-radius: unset;
      border-bottom-right-radius: 10px;
   }

   .booking-history-date {
      justify-content: unset;
      margin-top: 3px;
   }

   .b-h-date {
      margin-left: -55px;
      border-top-left-radius: 0px;
      border-bottom-left-radius: 10px;
   }
}

@media only screen and (max-width:756px) {
   .booking-history-details {
      margin-top: 20px;
   }

   .from-add h5 {
      width: 25%;
   }

   .from {
      margin-right: 0px;
   }

   .hour .hour-detail {
      font-size: 16px;
   }

   .hour {
      padding: 30px 10px;
   }

   .scroll-arrow {
      display: block;
   }

   .booking-history-details2 {
      display: none;
   }
}

@media only screen and (max-width:576px) {

   /* .hour{
      position: absolute;
      float: right;
      bottom: 0px;
      top: auto;
      padding: 27px 0px;
      border-bottom-left-radius: unset;
      border-bottom-right-radius: 10px;
    } */
   .rent {
      width: 60%;
   }

   .hour .hour-detail {
      text-align: center;
   }

   .hour {
      padding: 22px 11px;
   }

   .booking-history-date {
      justify-content: unset;
      margin-top: 3px;
   }

   .b-h-date {
      margin-left: -33px;
      border-top-left-radius: 0px;
   }

   .from-to-address {
      margin-left: .7rem;
   }

   .from-add p {
      font-size: 14px;
   }

   .from-add h5 {
      font-size: 1.1rem;
      padding: 0px;
   }

   .hour .hour-detail {
      font-size: 14px;
   }
}

@media only screen and (max-width:480px) {
   .from-add h5 {
      font-size: 1rem;
   }

   .rent {
      width: 85%;
   }
}

@media only screen and (max-width:410px) {
   .hour {
      padding: 22px 9px;
   }
}

@media only screen and (max-width:408px) {
   .hour {
      padding: 43px 9px;
   }
}

@media only screen and (max-width:398px) {
   .hour {
      padding: 35px 9px;
   }
}

@media only screen and (max-width:382px) {
   .hour {
      padding: 25px 9px;
   }
}


/* ...........contact.html page css..............*/
.contact-us-bg {
   width: 100%;
   height: auto;
   background-image: url('../../assets/images/contact.jpg');
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
   position: relative;
   z-index: 1;
   overflow-x: hidden;
   margin-top: -8rem;
}

.contact-us-round {
   width: 100%;
   height: auto;
   display: flex;
   justify-content: end;
   position: absolute;
   right: -80px;
   bottom: 10px;
   z-index: -2;
}

.contact-us-round img {
   width: 40%;
   float: right;
   height: auto;

}

.contact-us-form {
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 2;
}

.contact-form {
   width: 75%;
   background-color: #fff;
   height: auto;
   border-radius: 10px;
   margin-top: 50px;
   margin-bottom: 150px;
}

.get-in-touch-sec {
   width: 100%;
   padding: 50px;
}

.get-in-touch-title {
   width: 100%;

}

.get-in-touch-title h2 {
   color: #130F40;
   font-family: 'rubikregular';
   font-weight: bold;
}

.line-booking-form {
   display: flex;
   flex-direction: row;
   position: relative;
   margin-top: 5px;
}

.line-booking-form .line {
   width: 44px;
   height: 3px;
   background-color: #130F40;

}

.line span {
   top: -15px;
   position: absolute;
   left: 50px;
   font-size: 20px;
   color: #D5D9DD;
   font-weight: 400;
   letter-spacing: -0.5px;
}

.contact-name {
   position: relative;
   margin-top: 30px;
}

.contact-name .effect-22 {
   width: 100%;
   border: 0;
   padding: 9px 15px;
   border: 1px solid rgba(243, 243, 245, .7);
   position: relative;
   background: transparent;
   border-radius: 10px;
   background-color: rgba(243, 243, 245, .7);
   z-index: 1;
}

.contact-name .effect-22:active,
.contact-name .effect-22:focus {
   background-color: #fff;
   box-shadow: unset;
   border: 1px solid rgb(19, 15, 64, .7);
}

.contact-name .effect-22~label {
   position: absolute;
   left: 30px;
   width: 35%;
   top: 8px;
   color: #130F40;
   transition: 0.3s;
}

.contact-name .effect-22~label:active {
   z-index: -1;

}

.contact-name .effect-22:focus~label,
.has-content.effect-22~label {
   top: -18px;
   left: 21px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
   opacity: 1;
}

.contact-name .has-content.effect-22~label {
   top: -18px;
   left: 21px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
}

.contact-send {
   width: 100%;
   height: auto;
   display: flex;
   justify-content: center;
}

.contact-send button {
   background-color: #130F40;
   margin-top: 30px;
   border-radius: 10px;
   padding: 5px 45px;
   color: #fff;
   text-decoration: none;
   font-family: 'antipasto pro';
   font-size: 22px;
}

.contact-send button:hover, .contact-send button:focus, .contact-send button:active {
   background-color: #130F40;
   color: #ffffff;
   border-color: #130F40;
}

.p-e-a-sec {
   width: 100%;
   background-color: #F5F6F8;
   float: right;
   padding: 40px 7px 30px 60px;
   border-top-right-radius: 10px;
   border-bottom-left-radius: 100px;
}

.contact-phone {
   margin-bottom: 30px;
}

.contact-phone span {
   color: #130F40;
   font-weight: bold;
   font-family: 'rubikregular';
   font-size: 16px;

}

.contact-phone p {
   font-weight: lighter;
   color: #130F40;
   padding-left: 35px;
   font-family: 'rubikregular';
   padding-top: 10px;
}

.email-enquiry span {
   color: #130F40;
   font-weight: bold;
   font-family: 'rubikregular';
   font-size: 16px;
}

.email-enquiry {
   margin-bottom: 30px;
}

.email-enquiry p {
   font-weight: lighter;
   color: #130F40;
   padding-left: 35px;
   font-family: 'rubikregular';
   padding-top: 10px;
}

.address-enquiry {
   margin-bottom: 15px;
}

.address-enquiry span {
   color: #130F40;
   font-weight: bold;
   font-family: 'rubikregular';
   font-size: 16px;
}

.address-enquiry p {
   font-weight: lighter;
   color: #130F40;
   padding-left: 35px;
   font-family: 'rubikregular';
   padding-top: 10px;
   padding-bottom: 1 0px;
}

@media only screen and (max-width:1200px) {
   .contact-form {
      width: 90%;
   }
}

@media only screen and (max-width:992px) {
   .contact-us-bg {
      background-image: unset;
   }

   .contact-us-round {
      display: none;
   }

   .contact-form {
      /* margin-top: 0px; */
      margin-bottom: 50px;
   }

   .contact-us-form {
      background-color: unset;
   }

   .p-e-a-sec {
      width: 100%;
      border-radius: 10px;
   }

   .get-in-touch-sec {
      padding: 20px
   }
}

@media only screen and (max-width:767px) {
   .contact-form {
      width: 100%;
   }

   .p-e-a-sec {
      padding: 40px 7px 30px 30px;
   }

   .contact-us-bg {
      margin-top: 0px;
   }
}

/* .......................without login page css index2.html...................... */
.login-btn-res .btn {
   border: none;
   background-color: #f5f5f7;
   padding: 8px 20px;
   margin-right: 8px;
   font-family: 'rubikregular';
   color: #130F40;
   font-weight: 500;
}
.header-first .navbar-nav {
   /* margin: 0px; */
   margin-left: 80px;
}

.signin-signup-btn {
   position: absolute;
   top: 35px;
   right: 35px;
   display: flex;
   flex-direction: row;
}

.signin-signup-btn button {
   border: none;
   background-color: #f5f5f7;
   padding: 8px 20px;
   margin-right: 8px;
   font-family: 'rubikregular';
   color: #130F40;
   font-weight: 500;
}

.signin-signup-btn button:hover {
   background-color: #130F41;
   border: none;
   color: #fff;
}

.signin-signup-btn button:focus {
   background-color: #f5f5f7;
   color: #130F40;
}

/* modal */
.modal.open {
   opacity: 1;
   visibility: visible;
}

.modal.open .content {
   transform: scale(1);

}

@media only screen and (max-width:992px) {
   .header-first .navbar-nav {
      margin-left: 0px;
   }

   .navbar-nav .logout-btn-res {
      width: 100%;
      position: absolute;
      bottom: 30px;

   }

   .navbar-nav .header-logout-btn {
      margin: 0px auto;
      background-color: #ffffff !important;
      padding: 5px 35px;
    
   }
   .navbar-nav .header-logout-btn a{
      color: #130F40;
      /* font-size: 22px; */
      text-decoration: none;
      font-family: 'rubikregular';
      font-weight: bold;
      padding:0;
      border:unset;
   }
   .navbar-nav .header-logout-btn:hover,.navbar-nav .header-logout-btn:active, .navbar-nav .header-logout-btn:focus{
      border-color:#ffffff ;
   }
   .navbar-nav .header-logout-btn a:hover,.navbar-nav .header-logout-btn a:active, .navbar-nav .header-logout-btn a:focus{
      border:unset;
      padding:0;
   }
   .sign-up {
      display: none;
   }

   .signin-signup-btn button.login {

      padding: 5px 20px;
      margin-right: 30px;
   }

   /* .signin-signup-btn button.login-res{
      padding: 5px 20px;
      margin-right: 30px;
   } */
   .sign-up-res {
      position: absolute;
      bottom: 50px;
      width: 100%;
   }

   .sign-up-res button {
      background-color: #fff;
      padding: 5px 20px;
   }

   .sign-up-res button:hover, .sign-up-res button:focus, .sign-up-res button:active {
      background-color: #fff;
   }
}

@media only screen and (max-width:767px) {
   .signin-signup-btn {
      top: 33px;
   }

}

@media only screen and (max-width:576px) {
   .signin-signup-btn {
      top: 24px;
   }
}

/* login-page-modal */

#loginModal .modal-body {
   padding: 0px;

}

#loginModal .modal-header {
   border-bottom: 0px;
   padding: 0px;
}

#loginModal .modal-header button {
   margin-left: auto;
   z-index: 2;
}

#loginModal .modal-header button:focus {
   border: 0px;
}

.login-side-img {
   width: 90%;
   height: auto;
   border-bottom-right-radius: 50px;
}

.login-side-img img {
   width: 100%;
   height: 430px;
}

.modal-content {
   border-radius: 20px;
}

.login-page {
   width: 100%;
   height: auto;
}

.login-title {
   width: 100%;
   height: auto;
   margin-top: 30px;
   padding-left: 15px;
}

.login-title h3 {
   color: #130F40;
   font-family: 'rubikregular';
   font-weight: bold;
   margin-bottom: 0px;
}

.login-title .line {
   width: 60px;
   height: 3px;
   background-color: #130F40;
}

.login-page-form {
   width: 100%;
   height: auto;
   padding-right: 90px;
}

.login-form {
   position: relative;
   margin-top: 30px;
}

.login-form .effect-22 {
   width: 100%;
   border: 0;
   padding: 9px 15px;
   border: 1px solid rgba(243, 243, 245, .7);
   position: relative;
   background: transparent;
   border-radius: 10px;
   background-color: rgba(243, 243, 245, .7);
   z-index: 1;
}

.login-form .effect-22:active,
.login-form .effect-22:focus {
   background-color: #fff;
   box-shadow: unset;
   border: 1px solid rgb(19, 15, 64, .7);
}

.login-form .effect-22~label {
   position: absolute;
   left: 30px;
   width: 35%;
   top: 8px;
   color: #130F40;
   transition: 0.3s;
}

.login-form .effect-22~label:active {
   z-index: -1;

}

.login-form .effect-22:focus~label,
.has-content.effect-22~label {
   top: -18px;
   left: 21px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
   opacity: 1;
}

.login-form .has-content.effect-22~label {
   top: -18px;
   left: 21px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
}

/* .login-form-in{
   margin-top:50px;
} */
.forgot-pass {
   width: 100%;
   text-align: end;
   margin-top: 15px;
}

.forgot-pass a {
   color: #9C9CA5;
   font-family: 'rubikregular';
   font-size: 14px;
   text-decoration: none;
}

.login-send {
   width: 100%;
   height: auto;
   display: flex;
   justify-content: center;
   margin-top: 30px;
   margin-bottom: 100px;
}

.login-send .btn {
   background-color: #130F40;
   margin-top: 30px;
   border-radius: 10px;
   padding: 5px 45px;
   color: #fff;
   text-decoration: none;
   font-family: 'antipasto pro';
   font-size: 22px;
   /* width:100%; */
}


.login-send .btn:hover, .login-send .btn:focus, .login-send .btn:active {
   background-color: #130F40;
   color: #fff;
   border-color: #130F40;
}

.create-acc-link {
   width: 100%;
   margin-bottom: 20px;
}

.create-acc-link p {
   font-family: 'rubikregular';
   color: #C3C8CD;
}

.create-acc-link a {
   color: #130F40;
   font-family: 'rubikregular';
   text-decoration: none;
}

.modal-body {
   padding: 0px;
}

@media only screen and (max-width:992px) {
   #loginModal .modal-body {
      /* padding:0rem 1.5rem; */
   }

   .login-side-img {
      width: 100%;
   }

   .login-side-img img {
      height: 360px;
   }

   #loginModal .modal-header button span {
      font-size: 30px;
      padding: auto;
   }

   .login-page-form {
      padding-right: 0px;
   }

   .create-acc-link p {
      text-align: center;
   }

   .create-form .effect-22~label {
      width: 80%;
   }

   /* #createModal .modal-body{
      padding:0rem 1.5rem;
   } */
   

}

@media only screen and (max-width:768px) {

   #createModal .modal-dialog {
      margin: 60px auto;
   }

   #createModal .modal-body {
      top: 0px;
      /* padding:0rem 1.5rem; */
   }
   .login-title{
      padding-left: 0px;
   }
   .create-title {
      padding-left: 0px;
   }
   .login-title .line {
      width: 45px;
   }

   #loginModal .modal-dialog {
      margin: 60px auto;
   }

   #loginModal .modal-body {
      top: 0px;
      /* padding:0rem 1.5rem; */
   }

   #createModal .modal-header button span {
      font-size: 30px;
      padding: auto;
   }

   #createModal .modal-header {
      border-bottom: 0px;
      padding: 0px;
   }

   #createModal .modal-header button {
      margin-left: auto;
      z-index: 2;
   }

   .gender-btn-edit-profile {
      margin-top: 10px;
   }
}

@media only screen and (max-width:576px) {
   #loginModal .modal-dialog {
      margin: 60px 40px;
   }

   #createModal .modal-dialog {
      margin: 60px 40px;
   }

   .gender-btn {
      margin-top: 0px;
   }
}

@media only screen and (max-width:480px) {
   #loginModal .modal-dialog {
      margin: 60px 20px;
   }

   #createModal .modal-dialog {
      margin: 60px 20px;
   }

   .create-acc-link p {
      font-size: 13px;
   }
}

/* .................create account modal.............*/
.create-side-img {
   width: 85%;
   height: auto;
   border-bottom-right-radius: 50px;
}

.create-side-img img {
   width: 100%;
   height: 430px;
}

.create-page {
   width: 100%;
   height: auto;

}

.create-title {
   width: 100%;
   height: auto;
   margin-top: 30px;
   padding-left: 15px;
}

.create-title h3 {
   color: #130F40;
   font-family: 'rubikregular';
   font-weight: bold;
   margin-bottom: 0px;
}

.create-title .line {
   width: 70px;
   height: 3px;
   background-color: #130F40;
}

.create-page-form {
   width: 100%;
   height: auto;
   padding-right: 40px;
}

.gender-btn {
   width: 100%;
   margin-top: 20px;
}

.gender-btn label {
   color: #130F40;
   font-family: 'rubikregular';
   font-weight: bold;
}

.gender-btn button {
   width: 100%;
   background-color: #F8F8FA;
   padding: 5px 9px;
   text-align: center;
}

.gender-btn button:hover {
   background-color: #130F40;
   color: #fff;
}

.create-form {
   position: relative;
   margin-top: 33px;
}

.create-form .effect-22 {
   width: 100%;
   border: 0;
   padding: 9px 15px;
   border: 1px solid rgba(243, 243, 245, .7);
   position: relative;
   background: transparent;
   border-radius: 10px;
   background-color: rgba(243, 243, 245, .7);
   z-index: 1;
}

.create-form .effect-22:active,
.create-form .effect-22:focus {
   background-color: #fff;
   box-shadow: unset;
   border: 1px solid rgb(19, 15, 64, .7);
}

.create-form .effect-22~label {
   position: absolute;
   left: 30px;
   width: 55%;
   top: 8px;
   color: #130F40;
   transition: 0.3s;
}

.create-form .effect-22~label:active {
   z-index: -1;

}

.create-form .effect-22:focus~label,
.has-content.effect-22~label {
   top: -18px;
   left: 12px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
   opacity: 1;
}

.create-form .has-content.effect-22~label {
   top: -18px;
   left: 12px;
   font-size: 12px;
   color: #333;
   transition: 0.3s;
}

.create-send {
   width: 100%;
   height: auto;
   display: flex;
   justify-content: center;
   margin-top: 30px;
   margin-bottom: 100px;
}

.create-send .btn {
   padding: 5px 45px;
   color: #fff;
   text-decoration: none;
   font-family: 'antipasto pro';
   font-size: 22px;
   background-color: #130F40;
   margin-top: 30px;
   border-radius: 10px;
}

.create-send .btn:hover, .create-send .btn:active, .create-send .btn:focus {
   background-color: #130F40;
   color: #fff;
   border-color: #130F40;
}


.sign-acc-link {
   width: 100%;
   margin-bottom: 20px;
}

.sign-acc-link p {
   font-family: 'rubikregular';
   color: #C3C8CD;
   text-align: center;
}

.sign-acc-link a {
   color: #130F40;
   font-family: 'rubikregular';
   text-decoration: none;
}

@media only screen and (max-width:992px) {
   .create-page-form {
      padding-right: 40px;
   }
}

@media only screen and (max-width:768px) {
   .create-page-form {
      padding-right: 0px;
   }

   .create-title .line {
      width: 45px;
   }

}

.modal {
   border: 0px !important;
}

body.modal-open .background-container {
   filter: blur(4px);
}