@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&display=swap');
/* font-family: 'Lato', sans-serif; */
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
/* font-family: 'Roboto', sans-serif; */
* {
    margin: 0;
    padding: 0;
}

.manu-open {
    overflow: hidden;
}
.or-loaction {
    text-align: center;
    padding: 5px 0;
}

.or-loaction span {
    color: rgba(0,0,0,0.5);
}

div#selectionDesLocation label {
    /* margin-bottom: 20px; */
    text-align: center;
    color: #000;
    /* font-size: 20px; */
    font-weight: 500;
}
/* .tab-lists.step-active-lists {
    top: 147px;
} */
.tab-lists.step-active-lists-new {
    top: 28px !important;
}
.garage-content {}

.garage-content .custom-radio h4 {
    margin-bottom: 10px;
    text-align: center;
    color: #000;
    font-size: 20px;
}
.contact-btnss {
    display: flex;
    align-items: CENTER;
}

.swal2-icon.swal2-warning {
    border-color: #2778c4 !important;
    color: #2778c4 !important;
}


.garage-content .custom-radio .custom-radio {}

.garage-content .custom-radio .address-field {
    background-color: transparent;
    border: 1px solid #cecece;
}

.close {
    position: absolute;
    right: 5px;
    color: red;
    opacity: 1;
    z-index: 9999999;
}

body {
    font-family: 'Lato', sans-serif;
}
button:focus,
select:focus,
input:focus,
textarea:focus {
    outline: none;
}
ul{
    margin:0;
    padding:0;
}
li{
    list-style:none;
}
img {
    max-width: 100%;
    display: block;
}
a {
    color: inherit;
}
a:hover,
a:focus {
    color: inherit;
    text-decoration: none;
}
p {
    margin: 0;
}
h1,h2,h3,h4,h5,h6{
    margin: 0;
    color:inherit;
    font-weight: inherit;
}
h1 {
    font-size: 60px;
}
h2 {
    font-size: 42px;
}
h3 {
    font-size: 30px;
}
h4 {
    font-size: 24px;
}
h5 {
    font-size: 18px;
}
h6 {
    font-size: 12px;
}
span,a {
    display: inline-block;
}
.flex {
    display: flex;
    flex-wrap: wrap;
}
select {
    background: url(../images/select.png) no-repeat right 13px center/14px;
     -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
/******************************
            HEADER
*******************************/
.pac-container.pac-logo{
    z-index: 99999999!important;
}
.tab-lists ul li {
    width: 10px;
    height: 10px;
    background-color: #cecece;
    border-radius: 50%;
    margin: 0 2px!important;
}

.tab-lists ul {display: inline-flex;align-items: center;}

.tab-lists {
    position: absolute;
    top: 47px;
    left: 30px;
}

.tab-lists ul li.active-tab-list {
    background-color: #2d81bc;
}
.empty-header {
    height: 110px;
}
.account-area .container {
    position: relative;
}
.mobile-manu {
    display: none;
}
.site-logo {
    text-align: center;
    position: absolute;
    right: 0;
    left: 0;
    margin: 0 auto;
    max-width: 22%;
}
/* .account-area:before {content: "";position: absolute;background-color: rgba(0,0,0,0.5);width: 100%;height: 100%;}
.account-area.payment-section.step1-section::before {
    background-color: rgba(0,0,0,0.5);
} */
.account-area {
    height: calc(100vh - 110px);
    display: flex;
    align-items: flex-start;
    /* justify-self: center; */
    text-align: center;
    background: url('../images/blue_bg.png') center/cover no-repeat;
    position: relative;
}
.header-content {
    padding: 10px;
    align-items: center;
    justify-content: space-between;
    /* box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px; */
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 9;
    height: 110px;
    display: flex;
    align-items: center;
    background-color: #fff;
}
/*.header-content .site-logo img{
    max-width: 300px;
}*/
.site-menu span {
    height: 2px;
    width: 23px;
    background: #000000;
    display: block;
    margin-top: 5px;
}
.account-area-content > span {
    display: block;
    margin: 0 auto 8px;
    max-width: fit-content;
    text-transform: uppercase;
}
.login-area {
    max-width: 450px;
    margin: 40px auto 0;
}
.login-area a {
    display: block;
}
.login-link {
    padding: 10px 20px;
    width: 100%;
    text-align: center;
    background: #1E5D89;
    border-radius: 0;
    font-size: 18px;
    color: #ffff;
    text-transform: uppercase;
}
.login-area > span {
    color: #fff;
    font-size: 18px;
    margin: 24px 0;
    position: relative;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    text-transform:uppercase;
}
.login-area span::before,
.login-area span::after {
    content: '';
    position: absolute;
    top: 15px;
    left: -70px;
    width: 44px;
    height: 1px;
    background: #fff;
}
.login-area span::after {
    right: -70px;
    left: unset;
}
.guest-link {
    background: transparent;
    padding: 10px 20px;
    border-radius: 0;
    color: #1E5D89;
    font-size: 18px;
    border: 1px solid #fff;
    text-transform: uppercase;
    font-weight: 800;
}
.guest-link:hover {
    color: #1E5D89;
}
.account-area-content > span {
    color: #fff;
    font-size: 15px;
}
.service-row {
    display: flex;
    flex-wrap: wrap;
    width: 40%;
    margin: 0 auto;
}
.service-column {
    width: 33%;
}
.service-repeater img {
    margin: 0 auto;
}
.service-repeater h4 {
    color: #000000;
    font-size: 17px;
}
.service-repeater {
    padding: 15px 0;
}
.service-section {
    padding: 10px 0;
}
.account-area-content h2 {
    color: #fff;
    font-weight: 800;
    text-transform: uppercase;
    margin: 10px 0;
    font-size: 35px;
}
.account-area-content h3 {
    text-transform: uppercase;
    font-weight: 800;
    font-size: 25px;
    color: #fff;
}
.account-area-content img {
    margin: 0px auto 0 auto;
    max-width: 45px;
}
.account-area-content {
    padding-top: 40px;
}
.service-img {
    width: 70px;
    height: 70px;
    background-color: #11A9C9;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 10px auto;
    padding: 13px;
}
.service-active .service-img {
    background-color: #148AA3;
}
.pricing-area {
    display: flex;
    justify-content: center;
    align-items: center;
}
.pricing-area p,
.price {
    color: #54F21F;
    font-weight: 900;
    font-size: 50px;
    margin:30px 0  0px 0;
}
.total-miles {
    color: #54F21F;
    margin-bottom: 0px;
}
.banners-titles {
    margin: 20px 0 30px 0;
}
.step2-payments .container,.step2-payments .account-area-content {
    height: 100%;
}
.step2-payments .account-area-content {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.btn-transparent {
    background-color: transparent;
    border: 1px solid #FFFFFF;
    border-radius: 25px;
    color: #FFFFFF;
    text-transform: uppercase;
    font-weight: 900;
    background-color: #11A9C9;
}
.account-area-content .btn-transparent {
    min-width: 250px;
}
.payment-section .account-area-content {
    padding-top: 0px;
}
.address-field {
    background-color: #11A9C9;
    width: 100%;
    border-radius: 35px;
    padding: 8px 20px;
    border: 2px solid #fff;
    /*color: #fff;*/
    font-size: 18px;
}

.find-me {
    max-width: 400px;
    margin: 50px auto;
}

.find-me .address-field {
    text-align: center;
    color: #fff;
}
.find-me .address-field:focus{
    color:#000;
    background-color: #cecece;
}
.btn-white {
    width: 100%;
    background-color: #fff;
    width: 100%;
    border-radius: 35px;
    padding: 7px 20px;
    border: 2px solid #fff;
    color: #000;
    font-size: 18px;
}
.or-img img {
    max-width: initial;
    margin: 0 auto;
}
.modal-height {
    height: calc(100vh - 200px);
    overflow: auto;
    margin-bottom: 20px;
}
.credit-cart {
    /*height: 320px;
    overflow: auto;*/
    margin-bottom: 20px;
}
.or-img {
    margin: 20px 0;
}
.phone-icons a img {max-width: 20px;margin-right: 10px;position: relative;top: 5px;}
.login-fields.forgot-password a {
    color: #fff;
    text-align: left;
}
.find-me .address-field::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #fff;
    opacity: 1; /* Firefox */
}
.manual-address .address-field::placeholder{
    color: #000000 !important;
}
.find-me .address-field:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #fff;
}
.find-me .address-field::-ms-input-placeholder { /* Microsoft Edge */
    color: #fff;
}
.custom-modal .modal-content {
    background-color: transparent;
    border: none;
}
.pricing-area p, .pricing-area h4 {
    margin: 0px 0!important;
}
.step-main-repeater {
    background-color: #fff;
    /* background-color: #f7f7f7; */
    padding: 25px;
    border-radius:20px;
}

.step-form-title h4 {
    color: #000000;
    font-weight: 700;
}

h4 {}

.step-form-title {
    margin-bottom: 10px;
}

.custom-radio > label {
    /* color: #000000; */
    color: #151515;
    font-weight: 600 !important;
    display: block;
    margin-bottom: 15px;
    font-size: 15px;
}

.custom-box-radio {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.radio-repeater{
    margin-bottom: 10px;
}
.radio-repeater label {
    border: 1px solid #EAEAEA;
    border-radius: 5px;
    padding: 4px 30px;
    color: #000000;
    margin: 0 10px;
    cursor: pointer;
}

.radio-repeater input[type=radio] {
    display: none;
}

.custom-radio {
    margin-bottom: 20px;
}

.radio-repeater input[type=radio]:checked {}

.radio-repeater input[type=radio]:checked ~ label {
    background-color: #2d81bc;
    color: #fff;
}

.special-notes {
    width: 100%;
    resize: none;
    background-color: #F1F1F1;
    border: none;
    height: 115px;
    border-radius: 10px;
    padding: 10px;
}

/*.modal-steps-form .custom-radio:last-child {*/
/*    margin-bottom: 0;*/
/*}*/

.custom-radio .btn-next {
    background-color: #2d81bc;
    display: block;
    width: 100%;
    border-radius: 25px;
    padding: 9px 20px;
    color: #fff!important;
    font-size: 18px;
}
.custom-radio select {
    width: 100%;
    padding: 10px 10px;
    background-color: transparent;
    border: 1px solid #EAEAEA;
    border-radius: 25px;
    color: #000000;
    font-weight: 400;
}
.step-form-title img {
    margin: 15px auto;
}
.step-form-title {
    margin-bottom: 15px;
}
.general-field {
    border: 1px solid #E9E9E9;
    width: 100%;
    padding: 10px;
    border-radius: 25px;
    color: #000;
    font-weight: 400;
    height: auto !important;
}
.step-form-title p {
    color: #000;
    font-size: 14px;
    margin: 10px 0 0 0;
    font-weight: 400;
}
.modal-steps-form{
    display: none;
}
.modal-steps-form.step-active{
    display: block;
}
.payment-ccv {
    display: flex;
    justify-content: space-between;
}
.payment-ccv .custom-radio {
    width: 48%;
}
.inner-steps h2 {
    color: #fff;
    text-transform: uppercase;
    font-size: 20px;
}
.inner-steps h3 {
    color: #54F21F;
    font-weight: 700;
    margin: 15px 0;
}
.map-content {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 5;
}

.map-content:before {
    position: absolute;
    content: " ";
    background-color: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
}

.map-address {
    position: relative;
}

.map-content h2 {
    color: #54F21F;
    margin-bottom: 20px;
    font-weight: 900;
}

.map-content p {
    color: #fff;
    margin: 20px 0;
    font-size: 17px;
}
.map-inner-content {
    text-align: center;
    position: relative;
    max-width: 430px;
}

.mobile-apps a {
    margin: 0 10px;
}
.driver-rows{
    max-width: 700px;
    margin: 0 auto;
}
.driver-repeater {
    background-color: #F5F5F5;
    padding: 0;
    border-radius: 20px;
    margin-bottom: 10px;
}
.driver-lists{
    padding: 50px 0;
}
.driver-body {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #cecece;
    padding: 10px;
}

.driver-detail {
    display: flex;
    justify-content: space-between;
}

.driver-column {
    width: 100px;
    height: 100%;
    background-color: #94CB47;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 13px;
    margin-right: 20px;
    border-radius: 16px;
    height: 100px;
}

.driver-column1 {
    width: calc(100% - 120px);
}

.driver-column h5 {
    color: #fff;
    margin-top: 10px;
    font-weight: 700;
}

.driver-column1 h4 {
    color: rgb(0 0 0 / 40%);
    font-size: 17px;
    margin-bottom: 10px;
}

.driver-image {
    width: 50px;
    height: 50px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 50%;
}

.driver-detail-column {
    display: flex;
    align-items: center;
}

.drive-content h3 {
    color: #000000;
    font-weight: 700;
    font-size: 25px;
}

.drive-content {
    margin-left: 20px;
}

.drive-content p {
    color: rgb(0 0 0 / 40%);
    font-size: 14px;
}

.btn-red {
    display: inline-flex;
    align-items: center;
    background-color: #CC470D;
    border-radius: 26px;
    color: #fff;
    padding: 8px 20px;
    align-items: center;
    justify-content: center;
}
.driver-footer {
    padding: 10px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.driver-footer img {
    position: absolute;
    right: 10px;
}
.btn-cancel {
    display: inline-flex;
    align-items: center;
    border: 1px solid #CC470D;
    border-radius: 26px;
    color: #CC470D;
    padding: 5px 29px;
    align-items: center;
    justify-content: center;
    background-color: transparent;
}
.dispatch {
    background-color: #80cd55;
    padding: 15px;
    color: #fff;
    position: relative;
    z-index: 5;
    text-transform: uppercase;
}
.dispatch-tolltip img {
    position: absolute;
    right: 0;
    top: 0;
    max-width: 15px;
    cursor: pointer;
}
.dispatch h5 {
    font-weight: 700;
    font-size: 20px;
}
.user-name {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.user-imgae {
    width: 40px;
    height: 40px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    margin-right: 10px;
}
.user-name h5 {
    margin-right: 10px;
}
.site-menu {
    width: 240px;
}
.user-menu {
    text-align: right;
    position: relative;
}
/* .site-logo {
    width: calc(100% - 480px);
    text-align: center;
} */
.site-logo {
    text-align: center;
}
.login-header {
    justify-content: space-between;
    display: flex;
}
.login-column1 {
    display: flex;
    align-items: center;
}
.login-column1 .login-logo {
    padding-right: 60px;
}
.side-manu-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
}
.close-sidemanu img {
    max-width: 20px;
    position: absolute;
    top: 10px;
    right: 10px;
}
.manu-open .sidebar-header {
    left: 0;
    width: 320px;
}
.manu-open:before {
    position: fixed;
    content: " ";
    background-color: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
    z-index: 99;
}
.sidebar-header {
    width: 310px;
    background-color: #11A9C9;
    height: calc(100vh - 85px);
    position: fixed;
    left: 0;
    overflow: auto;
    top: 0;
    height: 100%;
    z-index: 99;
    display: block;
    left: -100%;
    width: 0;
    overflow: auto;
}
.sidebar-leftbar {
    width: calc(100% - 310px);
    height: 320px;
    margin-left: 310px;
}
.dashboard-sidebar {
    display: flex;
}
.roadside-manu li a {
    display: flex;
    align-items: center;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    font-family: 'Lato', sans-serif;
}

.roadside-manu li {
    padding: 15px 20px;
}
.leftbar-container {
    padding: 15px;
}

.main-title {
    margin-bottom: 20px;
}

.main-title h3 {
    color: #000000;
    font-weight: 500;
    font-size: 26px;
}

.grey-container {
    background-color: #F4F4F4;
    padding: 30px;
    border-radius: 8px;
    min-height: calc(100vh - 169px);
}

.password-title h5 {
    color: #000000;
    font-weight: 500;
    font-family: 'Roboto', sans-serif;
    margin-bottom: 10px;
}
.field-repeater label {
    color: #000000;
    font-weight: 400;
    margin-bottom: 10px;
    display: block;
}
.field-row {
    position: relative;
    width: 50%;
}
.white-field {
    width: 100%;
    border: 1px solid #D9D9D9;
    padding: 10px 30px 10px 10px;
    border-radius: 4.5px;
}
.field-row img {
    position: absolute;
    right: 10px;
    top: 17px;
}
.field-repeater {
    margin-bottom: 20px;
}
.btn-blue {
    background-color: #3C8DBC;
    color: #fff;
    padding: 8px 20px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 400;
}
.payment-repeater {
    background-color: #fff;
    border-radius: 8px;
    padding: 15px;
    display: flex;
    align-items: center;
    max-width: 700px;
    margin-bottom: 20px;
}
.payment-image {
    width: 90px;
}
.payment-option {
    width: 120px;
    text-align: right;
}
.payment-name {
    width: calc(100% - 210px);
}

.payment-option img {
    margin-left: auto;
}
.payment-name h4 {
    color: #000000;
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 3px;
}
.payment-name p {
    font-size: 13px;
    color: rgb(0 0 0 / 40%);
    font-weight: 400;
}
.edit-row {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.edit-row .field-repeater {
    width: 49%;
}
.edit-row .field-repeater .field-row {
    width: 100%;
}
.full-width {
    width: 100%;
}
.full-width .field-row {
    width: 100%;
}
.edit-row .full-width {
    margin-bottom: 10px;
}
.profile-imgs {
    width: 100px;
    height: 100px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    position: relative;
    margin-bottom: 20px;
}
.camera-icons {
    position: absolute;
    bottom: 0;
    right: 0;
}
.profile-imgs label {
    cursor: pointer;
}
.memebership-row {
    margin:-10px;
    display: flex;
    flex-wrap: wrap;
}

.memebership-column {
    width: calc(100% / 4);
    padding: 10px;
}

.membership-innerColum label {
    display: block;
    text-align: center;
}

.membership-innerColum {
    background-color: #3C8DBC;
    padding: 30px;
}

.membership-head h5 {
    border-bottom: 1px solid rgb(255 255 255 / 50%);
    color: #fff;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.membership-body h4 {
    color: #fff;
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    margin-bottom: 10px;
}

.membership-body p {
    color: #fff;
    margin-bottom: 10px;
    font-size: 15px;
}

.membership-body h6 {
    margin-bottom: 20px;
    color: #fff;
    font-size: 16px;
    border-bottom: 1px solid rgb(255 255 255 / 50%);
    padding-bottom: 20px;
    display: inline-flex;
}
.membership-body ul li {
    color: #fff;
    padding-bottom: 10px;
    font-size: 15px;
}
.membership-footer .btn-join {
    display: block;
    width: 100%;
    background-color: transparent;
    border: 1px solid #fff;
    text-transform: uppercase;
    border-radius: 17.5px;
    color: #fff;
    margin-top: 20px;
    font-weight: 900;
    font-family: 'Lato', sans-serif;
}
.green-column {
    background-color: #64BF22;
}
.full-width-text {
    margin-top: 20px;
}

.full-width-text p {
    margin-bottom: 20px;
    color: #000000;
    font-weight: 600;
}.car-repeater-row {
    display: flex;
    flex-wrap: wrap;
}
.car-column {
    width: calc(100% / 6);
    padding: 10px;
    background-color: transparent;
    border: none;
}
button.car-column:focus {
    outline: none;
    border: none;
}
.car-innerColumn {
    background-color: #F7F7F7;
    border-radius: 20px;
    padding: 10px;
    height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}
.car-innerColumn h5 {
    font-weight: 600;
    margin: 7px 0;
    font-size: 14px;
    font-family: 'Lato', sans-serif;
}
.car-innerColumn p {
    color: rgb(0 0 0 / 50%);
    font-size: 13px;
}
.delete-icons {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
}
.sub-dropdwon-manu {
    position: absolute;
    background-color: #fff;
    width: 100%;
    left: 0;
    border-radius: 10px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    top: 43px;
    padding: 0 10px;
    display: none;
    cursor: pointer;
}
.sub-dropdwon-manu li a {
    display: flex;
    align-items: center;
    padding: 10px;
    border-bottom: 1px solid rgb(112 112 112 / 40%);
    color: #000000;
    font-weight: 700;
}

.sub-dropdwon-manu li:last-child a {
    border-bottom: none;
}
.sub-dropdwon-manu li a img {
    width: 20px;
}
.guest-empty-header {
    height: 110px;
}
.modal{
    padding-right: 0!important;
}
.preloader-rescue {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    background-color: rgba(0,0,0,0.5);
    align-items: center;
    justify-content: center;
    /* background: url(../images/blue_bg.png) center/cover no-repeat; */
    z-index: 9;
    flex-direction: column;
}
.preloader-rescue.preloader-imgs-rescue{
    background: white;
}
.preloader-rescue.preloader-imgs-rescue img,
.preloader-rescue.preloader-imgs-rescue  p{
    position: relative;
}
.preloader-rescue.preloader-imgs-rescue:before {
    content: " ";
    position: absolute;
    /* background-color: rgba(0,0,0,0.5); */
    width: 100%;
    height: 100%;
}
.preloader-rescue p{
    color:#000000;
}
.preloader {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    background-color: rgba(0,0,0,0.5);
    align-items: center;
    justify-content: center;
    /* background: url(../images/blue_bg.png) center/cover no-repeat; */
    z-index: 9;
    flex-direction: column;
}
.preloader.preloader-imgs{
    background: url(../images/blue_bg.png) center/cover no-repeat;
}
.preloader.preloader-imgs img,
.preloader.preloader-imgs  p{
    position: relative;
}
.preloader.preloader-imgs:before {
    content: " ";
    position: absolute;
    background-color: rgba(0,0,0,0.5);
    width: 100%;
    height: 100%;
}
.preloader p{
    color:#fff;
}
.sr-onlys {
    width: 28px;
    height: 2px;
    display: block;
    background-color: #000;
    margin-bottom: 4px;
}
.manu-btn {
    display: inline-flex;
    flex-direction: column;
    cursor: pointer;
}
.close-sidemanu{
    cursor: pointer;
}
.login-column2 {
    width: 200px;
}
.login-column {
    width: 200px;
}
.login-header .login-column1 {
    width: calc(100% - 400px);
    text-align: center;
}
.login-header .login-column1 .site-logo {
    margin: 0 auto;
}

.login-field {
    width: 100%;
    border-radius: 25px;
    background-color: #fff;
    border: 1px solid transparent;
    padding: 10px 20px;
}

.login-fields {
    margin-bottom: 20px;
}

.login-forms .login-fields .guest-link {
    width: 100%;
}
.selected-cars select{
    background-image: url('../images/select_car.svg');
    background-repeat: no-repeat;
    background-position: left 10px center;
    padding-left: 35px;
    background-color: #F2FAFF;
}
.sidebar-header.dashboard-sidebars {
    position: fixed;
    left: 0;
    width: 310px;
    top: 110px;
}
.sidebar-header.dashboard-sidebars .side-manu-header {
    display: none;
}
.mobile-apps {
    margin-top: 50px;
}
.btn-cancel:focus,
.btn-red:focus,
.btn:focus{
    outline: none;
    box-shadow: unset;

}
.custom-tyres {
    display: flex;
    width: 100%;
}
.tyres-columns {
    width: 33%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.tyres-radio {
    text-align: left;
}
.tyres-radio input[type=radio] {
    display: none;
}
.tyres-radio label {
    position: relative;
    padding-left: 30px;
    font-size: 14px;
    color: #000000;
}
.tyres-radio label:before {
    position: absolute;
    content: " ";
    width: 12px;
    height: 12px;
    background-image: url('../images/empty-checkbox.svg');
    background-repeat: no-repeat;
    background-position: left center;
    /* border-radius: 50%; */
    left: 0;
    top:-1px;
    border: 1px solid black;
}
.tyres-radio input[type=radio]:checked ~ label:before{
    /* background-image: url('../images/fill-checkbox.svg'); */
    background-image: url('../images/custom-radiotype-checked.png');
    border: transparent !important; 
}
.tyres-columns .tyres-radio:last-child {
    margin-bottom: 50px;
}

.tyres-columns .tyres-radio:first-child {
    margin-top: 50px;
}
.user-name.mobile-users {
    display: none;
}
.down-arrows img{

    position: relative;
    bottom: -20px;
}
.down-arrows img {
    max-width: inherit;
    margin-top: 60px;
    animation: MoveUpDown 1s infinite;
}
.user-menu.mobile-users .user-name{
    display: none
}
@keyframes MoveUpDown {
    0%, 100% {
      bottom: 0;
    }
    50% {
      bottom: 20px;
    }
  }
@keyframes MoveUpDown1 {
    0%, 100% {
        top: -130px;
    }
    50% {
        top: -120px;
    }
}
.rodaside-content p {
    margin-bottom: 10px;
    color: #000000;
}

.rodaside-content ul li {list-style: inside;padding-bottom: 10px;color: #000000;}

.destinationPopUp {
    position: relative;
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 10px;
    padding-right: 15%;
}
.destinationTitle{
    font-weight: 700;
}
.destinationLocation {
    font-size: 14px;
}
.destinationBtn {
    background: transparent;
    border: 1px solid #11A9C9;
    color: #11A9C9;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 12px;
}
.reviewAndStar {
    display: flex;
    align-items: center;
}
.ratingStar {
    padding-right: 10px;
}
.starIcon li img {
    width: 10px;
    height: 10px;
    object-fit: contain;
}
.starIcon {
    display: flex;
    align-items: center;
    margin-right: 10px;
}
.starIcon li {
    padding: 0px 2px;
}
.destinationPhoneCall img {
    width: 15px;
    margin: 0px 10px;
}
.destinationMile img {
    width: 15px;
    margin: 0 auto;
}
.nearest-locations {
    height: 550px;
    overflow: auto;
}


.destinationMile {
    position: absolute;
    top: 0px;
    bottom: 0px;
    margin: auto;
    height: 40px;
    right: 30px;
}

.destinationMile p {
    font-size: 12px;
    padding: 5px 0px;
}
.guest-link {
    border: 2px solid #fff;
    border-radius: 35px;
    background-color: #11A9C9;
    color: #fff !important;
    width: 240px;
    margin: auto;
    font-weight: 600;
}
.login-link {
    padding: 10px 20px;
    width: 240px;
    margin: 0 auto;
    border-radius: 35px;
    background-color: #fff;
    color: #000;
}
.credit-cart-save button {
    width: 100%;
    background-color: #2d81bc;
    display: block;
    width: 100%;
    border-radius: 25px;
    padding: 9px 20px;
    color: #fff!important;
    font-size: 18px;
}
.user-menu.guest-user {
    position: absolute;
    left: 10%;
    top: 45px;
}


.gm-style-iw-d {
    overflow: unset !important;
    padding-right: 10px;
    padding-bottom: 10px;
    font-weight: 400;
}
.dispatch-tolltip {
    position: absolute;
    top: -150px;
    width: 420px;
    z-index: 99999;
    background-color: #256B9E;
    margin: 0 auto;
    left: 0;
    right: 0;
    padding: 2px;
    animation: MoveUpDown1 1.5s linear infinite;
}
.dispatch-tolltip p{
    font-size: 15px;
    /*text-transform: capitalize;*/
}
.dispatch-tolltip:before {
    position: absolute;
    content: " ";
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #256B9E;
    bottom: -15px;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.gm-style-iw.gm-style-iw-c {
    background: transparent;
    color: #fff;
    box-shadow: unset;
    text-align: center;
}
.gm-style .gm-style-iw-t::after{
    background: #01E224;
    z-index: -1;
    top:-10px;
}
.gm-style-iw.gm-style-iw-c button {
    display: none !important;
}
.quantity {
    position: relative;
    border: 1px solid rgba(37, 37, 37, 0.2);
    width: 100%;
    height: 40px;
    display: flex;
    background: transparent;
    justify-content: center;
    align-items: center;
    border-radius: 25px;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

.quantity input {
    font-size: 16px;
    font-family: 'suisseIntl-regular';
    border: none;
    clear: both;
    background: transparent;
    z-index: 2;
    color: #252525;
    text-align: center;
    padding: 0 15px;
}

.quantity input:first-child {
    left: 0;
    position: absolute;
    height: 25px;
    content: "";
}
.black-btn.quanity-btn button {
    min-height: 45px;
}

.quantity:before {
    content: "+";
    position: absolute;
    right: 15px;
    font-size: 24px;
    bottom: 10%;
    height:100%;
}

.quantity:after {
    content: "-";
    position: absolute;
    left: 15px;
    font-size: 24px;
    bottom: 10%;
    height:100%;
}

.quantity input:last-child {
    right: 0;
    position: absolute;
    height: 25px;
}

.quantity input.qty {
    color: black;
    width: calc(100% / 2);
    margin: auto;
}

.custom-quantity input.qty {
    color: white !important;
    width: calc(100% / 2);
    margin: auto;
}

.quantity input:focus {
    outline: 0;
}

.quantity-button {
    cursor: pointer;
    width: 35px;
    text-align: center;
    color: #000;
    top: 0;
    bottom: 0;
    position: absolute;
    font-size: 28px;
    line-height: 1.8;
    font-weight: 500;
}

.quantity-button.quantity-up {
    right: 0;
}

.quantity-button.quantity-down {
    left: 0;
}


/*.modal-steps-form.modal_step_4 .step-main-repeater {
    padding-top: 50px;
}*/
/*.modal-steps-form.modal_step_4 .inner-steps.text-center {
    position: absolute;
    transform: translatex(-50%);
    left: 50%;
    top: -21px;
}*/
.driver-detail-column .btn-red{
    background-color: #256B9E;
}
.service-dropdown {
    padding: 0 10px 10px 10px;
}
.service-dropdown select {
    width: 100%;
    padding: 10px;
    border: 1px solid #cecece;
    border-radius: 25px;
    color: #000;
    font-weight: 600;
}
.other-reasons {
    padding: 15px 10px;
}
.other-reasons.custom-radio {
    margin: 0;
    padding-top: 0;
}
@keyframes MoveUpDown2 {
    0%, 100% {
      bottom: 180px;
    }
    50% {
      bottom: 160px;
    }
  }
.scroll-images {
    position: fixed;
    bottom: 160px;
    right: 70px;
    z-index: 9;
     animation: MoveUpDown2 1s infinite;
}
.driver-column img {
    max-width: 54%;
}
.phone_with_contry {
    width: 182%
}
.step-main-repeater iframe {
    /*width: 100%;*/
}


p.fieldRow span.inputText input, p.group span.field input {
    width: 100%;
}
input#btn_pay_cc {
    border: none;
    border-radius: 50px;
    padding: 8px 20px;
    background-color: #2d81bc !important;
}
#iframeContainer {
    width: 100% !important;
}
.shadowBox {
    background-color: transparent !important;
    border-width: 0px !important;
}
#iframeContainer .shadowBox {
    margin: 0;
    width: 100%;
}
iframe#payflow-iframe {
    border: none;
    margin: 0;
}
div#fieldrowCCNumber {
    padding: 0 10px;
}
.sections-maps{
    height: calc(100vh - 140px);
}
.sections-maps #myMap{
    height: 100%;
}
.map-address.sections-maps .dispatch-tolltip {
    top: 10px;
    animation: unset;
    color: #fff;
    text-align: center;
    z-index: 9;
    position: unset;
    margin-bottom: 5px;
}
#hook{
    background: #01E224;
    color: #fff;
    box-shadow: unset;
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    margin-top: 10px;
}
.map-address.sections-maps .dispatch-tolltip:before {
    top: 60px;
    bottom: 0;
}
.map-address.sections-maps .dispatch-tolltip p{
    text-align: center;
    padding: 5px;
}

.map-address.sections-maps .dispatch-tolltip img{
    right: 6px;
    top: 8px;
}
#chatbot-chat {
    top: 93px!important;
    right: -19px!important;
}
.driver-header span {
    font-size: 15px;
    color: rgb(109, 107, 107);
    font-weight: 700;
}
.driver-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}
.driver-header h4 {
    margin-bottom: 0;
}
.rodaside-content ul li {
    font-weight: 700;
}
.blog-single-content {
    padding: 50px 0;
}
.blog-single-content h3 {
    margin-bottom: 20px;
    color: #000;
}
.blog-single-content p {
    margin-bottom: 20px;
    color: #000;
    font-size: 15px;
    font-weight: 400;
}
.blog-single-content h4 {
    margin-bottom: 20px;
    font-size: 20px;
    color: #000;
    font-weight: 600;
}
.blog-single-content img {
    margin: 0 auto 20px auto;
    display: block;
}
.blog-header .manu-btn1.main-mobile-btns1 {
    display: none;
}
/*--------new css gohar----*/
section.home-banner {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    min-height: 550px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-end;
    padding: 50px 0;
    position: relative;

}
section.home-banner:before {
    content: " ";
    position: absolute;
    background: linear-gradient(rgba(0,0,0,0.75) 0%, transparent 100%);
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.home-banner-text a:hover {
    color: #fff;
    opacity: .8;
}
.home-banner-text h2 {
    color: rgb(255, 255, 255);
    font-size: 2.1rem;
    font-weight: 600;
    letter-spacing: -.015em;
    line-height: 1.6;
}
.home-banner-text {
    max-width: 510px;
    position: relative;
}
.home-banner-text h4 {
    color: #fff;
    font-size: .9rem;
    text-transform: uppercase;
    opacity: .8;
    padding: 20px 0;
}
.home-banner-btn {
    padding: 20px 0;
}
.home-banner-btn a.read-more {
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 0;
    border-style: solid;
    border-width: 0;
    cursor: pointer;
    font-family: "transat-text","Helvetica Neue",Helvetica,Roboto,Arial,sans-serif;
    font-weight: normal;
    line-height: normal;
    margin: 0 0 1.25rem;
    position: relative;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    padding: 0.75rem 1.5rem 0.8125rem 1.5rem;
    font-size: 0.875rem;
    background-color: #8f09f9;
    border-color: #8106e3;
    color: #fff;
    transition: background-color 300ms ease-out;
    width: 140px;
}
.home-banner-btn i {
    color: #fff;
    font-weight: 500;
    font-size: 19px;
    padding-left: 3px;
}
/* .grid-sec {
    padding: 40px 0;
} */
.image-text-bg {
    min-height: 200px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.image-text-detail h4 {
    font-size: .8rem;
    text-transform: uppercase;
    font-weight: 700;
    color: #9d9aa3;
    margin-top: 10px;
}
.image-text-detail h2 {
    font-weight: 600;
    color: #26242d;
    margin-bottom: 0;
    font-size: 1.2rem;
    padding: 10px 0;
}
.image-text-detail h6 {
    font-size: 16px;
    min-height: 160px;
    line-height: 1.4;
}
.image-text-detail {
    margin-bottom: 40px;
}
.modal-steps-form.modal_step_4.step-active .scroll-images{
    bottom: 43%;
    /* background-color: red; */
    animation: MoveUpDown3 1s infinite;
}
@keyframes MoveUpDown3 {
    0%, 100% {
        bottom: 53%;
    }
    50% {
        bottom: 55%;
    }
  }
/*-----new css style----*/


#exTab1 .tab-content {
    color : white;
    background-color: #428bca;
    padding : 5px 15px;
}

#exTab2 h3 {
    color : white;
    background-color: #428bca;
    padding : 5px 15px;
}

/* remove border radius for the tab */

#exTab1 .nav-pills > li > a {
    border-radius: 0;
}

/* change border radius for the tab , apply corners on top*/

#exTab3 .nav-pills > li > a {
    border-radius: 4px 4px 0 0 ;
}

#exTab3 .tab-content {
    color : white;
    background-color: #428bca;
    padding : 5px 15px;
}
ul.nav.nav-pills {
    display: flex;
    justify-content: space-between;
    margin: 20px auto;
    flex-wrap: wrap;
    font-family: Roboto,sans-serif;
}
#exTab1 .tab-content {
    background-color: transparent;
}
/*.modal-body .tab-lists {
    position: absolute;
    top: 15px;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    padding: 3px 130px;
}
.modal-body .step-form-title {
    margin-top: 40px;
}*/
.credit-cart #terms{
    width: 21px;
    height: 26px;
    vertical-align: middle;
    margin-right: 10px;
}



@media (max-width:1024px) {
    .sidebar-leftbar{
        width:100%;
        margin-left: 0;
    }
    .service-row{
        width:100%;
    }
    .home-banner-text {
        max-width: 450px;
    }
    .home-banner-text h2 {
        font-size: 2.3rem;
    }
}
@media (max-width: 767px) {

    .empty-header {
        height: 79px;
    }
    .blog-header .guest-empty-header {
        height: 110px;
    }
    .dispatch {
        padding: 9px 10px;
        font-size: 14px;
    }
    .driver-lists {padding: 0px 0px;}
    #singleViewPage {
       
        overflow-x: hidden;
    }
    .gm-style-iw.gm-style-iw-c{
        max-width: 285px!important;
    }
    .dispatch-tolltip p {
        font-size: 13px;
    }
    .driver-lists {
        padding: 5px 0;
    }
    .map-address.sections-maps .dispatch-tolltip{
        padding: 0;
    }
    .map-address.sections-maps .dispatch-tolltip:before {
        top: auto;
        /* bottom: 46px; */
        bottom: 57px;
    }
    .ifram-payment {
        overflow: auto;
    }
    .step-main-repeater iframe {
        width: 480px;
    }
    .phone_with_contry{
        width: 127%;
    }
    .scroll-images {
        right: 30px;
    }
    .tab-lists{
        top:20px;
    }
    .step-form-title h4{
        font-size: 20px;
    }
    .step-main-repeater{
        padding:25px;
    }
    .tyres-columns .tyres-radio:first-child {
        margin-top: 0px;
    }
    .tyres-radio label {
        font-size: 12px;
    }

    .dispatch-tolltip{
        padding:10px;
    }
    .map-address div#map {
        height: calc(100vh - 300px)!important;
    }
/*    .modal-steps-form.modal_step_4 .step-main-repeater {
        padding-top: 36px;
        margin-top: 22px;
    }*/
/*    .modal-steps-form.modal_step_4 .inner-steps.text-center {
        top: 6px;
    }*/
/*.tab-lists.step-active-lists {
    top: 126px;
}*/
    .service-column:nth-child(3) .service-img img {
    max-width: 40px;
}
.mobile-step1section .account-area-content {
    padding-top: 50px;
    padding-bottom: 50px;
}

.service-column:nth-child(5) .service-img img {
    margin-right: 3px;
}
.account-area-content {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* align-items: center; */
}
.account-area{
    height: calc(100vh - 110px);
}
.account-area.step1-section {
    height: calc(100vh - 410px);
}
.account-area .container,
.account-area .account-area-content{
    height: 100%;
}
    .login-link {
        padding: 10px 5px;
        width: 240px;
        margin: 0 auto;
        font-size: 13px;
    }
    .guest-link{
        padding: 10px 5px;
        width: 240px;
        margin: 0 auto;
        font-size: 13px;
    }
    .down-arrows img {
        max-width: 45px;
        margin-top: 0px;
    }
    .mobile-manu {
        display: block;
    }
    .user-menu.mobile-users {
        display: block;
    }
    .user-menu.mobile-users .user-name{
        display: flex;
    }
    .user-menu.mobile-users .user-name {
        justify-content: center;
        flex-direction: column;
    }
    .user-menu.guest-user{
        display: block;
    }
    .user-menu.guest-user h5{
        color:#000;
    }
    .user-menu{
        display: none;
    }
    .service-img img {
        max-width: 25px;
        width: 30px;
        height: 30px;
        object-fit: contain;
    }
    .service-img {
        width: 45px;
        height: 45px;
    }
    .down-arrows img {
        max-width: 50px;
        margin-top: 20px;
    }
    .account-area.step1-section.mobile-step1section {
        min-height: 300px;
    }

    .main-login {
        min-height: calc(100vh - 110px)!important;
    }
.login-area span::after{
        right: -120px;
    left: unset;
}
.account-area.viewport-height {
    min-height: calc(100vh - 110px);
}
.login-area span::before, .login-area span::after{

    width: 95px;
}
.login-area span::before{
    left: -120px;
}
    .mobile-apps {
    margin-top: 0px;
}
    .edit-row .field-repeater,
    .field-row{
        width: 100%;
    }
    .grey-container{
        padding:20px;
    }
    .memebership-column{
        width: 100%;
    }
    .car-column{
        width: calc(100% / 2);
    }
    .manu-open .sidebar-header.dashboard-sidebars {
        left: 0;
        width: 320px;
        top: 0px;
    }
    .manu-open .sidebar-header.dashboard-sidebars .side-manu-header {
        display: block;
    }
    .sidebar-header.dashboard-sidebars {
        position: absolute;
        left: -100%;
        width: 0px;
        top: 0;
    }
    .account-area-content h2{
        font-size: 20px;
    }
    .login-manus .guest-empty-header {
        height: 150px;
    }
    .login-header{
        flex-wrap: wrap;
    }
    .login-column{
        /* order: 3;
        text-align: right; */
    }
    .user-name{
        justify-content: flex-end;
    }
    .login-column1{
        width: calc(100% - 200px);
        height: 95px;
        margin: 0 auto;
        /* position: relative; */
    }
    .login-column{
        width: 100px;
        height: 100%;
        display: flex;
        align-items: center;
        position: relative;
    z-index: 999;
    }
    .login-column2{
        width: 100px;
        height: 100%;
        display: flex;
        align-items: center;
    }
    .sub-dropdwon-manu{
        top:23px;
        width: 120px;
        right: 0;
        left: auto;

    }
    .user-name.mobile-users .user-imgae {
        width: 60px;
        height: 60px;
        margin: 0 auto;
    }
    .user-name.mobile-users {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .user-name h5{
        font-size: 15px;
        color: #fff;
        font-size: 16px;
        font-weight: 400;
    }
    .account-area-content{
        padding:0px 0 0 0;
        justify-content: center;
    }
    /* .account-area{
        min-height: auto;
    } */
    .mobile-apps a img {
        max-width: 70px;
    }
    .driver-column1{
        width:100%;
    }
    .driver-column{
        width: 70px;
        height: 70px;
        padding: 0;
    }
    .driver-image{
        height: 35px;
        width: 35px;
    }
    .drive-content h3{
        font-size: 15px
    }
    .driver-column h5{
        font-size: 12px;
    }
    .driver-column img {
        max-width: 30px;
    }
    .driver-column{
        margin:0 10px 0 auto;
    }
    .map-content p {
        margin: 5px 0;
        font-size: 13px;
    }
    .map-content h2{
        margin-bottom: 10px;
        font-size: 20px;
    }
    .map-content p{
        margin: 5px 0 10px 0;
        font-size: 13px;
    }
    .find-me {
        margin: 20px auto;
    }
    .payment-section .account-area-content {
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .service-row{
        width:100%;
        margin-bottom: 70px;
    }
    .account-area-content h3{
        font-size: 15px;
        margin-bottom: 10px;
    }

    .pricing-area p,
    .price{
        font-size: 40px;
        margin: 30px 0 0px 0;
    }
    .btn-white{
        padding: 5px 20px;
    }
    .address-field{
        padding: 5px 20px;
    }
    .service-repeater h4 {
        font-size: 15px;
    }
    .manu-open {
        overflow: hidden;
    }
    .user-menu.guest-user {
        left: 5%;
        top: 45px;
    }
    .site-logo{
        max-width: 55%;
    }
    .user-name h5 {
        margin-right: 5px;
    }
    .dispatch-tolltip{
        width: 100%;
    }
}

/*landing page css*/
* {
    margin: 0;
    padding: 0;
}
body {
    font-family: 'Poppins', sans-serif;
}
button:focus,
select:focus,
input:focus,
textarea:focus {
    outline: none;
}
ul{
    margin:0;
    padding:0;
}
li{
    list-style:none;
}
img {
    max-width: 100%;
    display: block;
}
a {
    color: inherit;
}
a:hover,
a:focus {
    color: inherit;
    text-decoration: none;
}
p {
    margin: 0;
}
h1,h2,h3,h4,h5,h6{
    margin: 0;
    color:inherit;
    font-weight: inherit;
}
h1 {
    font-size: 60px;
}
h2 {
    font-size: 42px;
}
h3 {
    font-size: 30px;
}
h4 {
    font-size: 24px;
}
h5 {
    font-size: 18px;
}
h6 {
    font-size: 12px;
}
span,a {
    display: inline-block;
}
.flex {
    display: flex;
    flex-wrap: wrap;
}
/******************************
            HEADER
*******************************/

.assitance-section {
    background: #e8e8e8;
    padding: 100px 0 70px;
}

.assistance-img {
    width: 22%;
}

.assistance-img img {
    width: 100%;
}
.iti.iti--allow-dropdown {
    width: 100%;
}
#phone_test {
    width: 100%;
}
/*
.assitance-text {
    width: 72%;
}*/
.modal-open .modal-body {
    padding: 0 20px;
}
.assitance-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.assitance-text h4 {
    font-size: 26px;
    text-transform: uppercase;
    font-weight: 700;
    color: #5c5c5c;
    margin-bottom: 25px;
}

.assitance-text p {
    font-size: 18px;
    color: #565656;
    line-height: 1.4;
}
.features-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.roadside-features-section {
    padding: 80px 0;
}

.single-feature {
    width: 28%;
    text-align: center;
    margin-bottom: 80px;
}

.single-feature h4 {font-size: 22px;text-transform: uppercase;font-weight: 700;color: #5c5c5c;margin: 15px 0;}

.single-feature p {
    font-size: 15px;
    color: #565656;
}
.feature_icon {
    width: 70px;
    height: 70px;
    background-color: #11A9C9;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 10px auto;
    padding: 13px;
}
.bottom-text {max-width: 800px;text-align: center;margin: auto;}
.join-now {
    text-align: center;
}
.join-now a {
    display: inline-block;
    margin-top: 20px;
    color: #fff;
    font-weight: bold;
    padding: 10px 30px;
    border-radius: 5px;
    transition: 0.4s ease;
    background-image: linear-gradient(to bottom, #0475ad, #348fbc);
}
.down-arrows.mobile-down-arrows {
    display: none;
}
.divider {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 10px 0;
    color: #aaa; /* Gray text color */
    font-size: 14px;
  }
  .divider span{
    font-size: 18px;
  }
  .divider::before,
  .divider::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid #ddd; /* Line color */
    margin: 0 10px; /* Space between line and text */
  }
  #googlepay-btn{
    width: 100%;
    border-radius: 25px;
    padding: 7px 20px;
    text-transform: uppercase;
    font-family: 'Arial Bold', sans-serif;
    font-weight: 600;
    text-align: center;
    color: gray;
    border: 1px solid lightgray;
    /*display: flex;*/
    display:none;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    gap: 5px;
    text-transform: capitalize;
    cursor: pointer;
  }
  #googlepay-btn img{
    width: 20px;
  }
@media screen and (max-width: 991px) {
    .single-feature {
        width: 47%;
    }
    .roadside-features-section {
        padding: 40px 0;
    }
    .car_image{
            max-width: 20% !important;
    }
    .tyres-columns{
        align-items: center;
    }
}

@media screen and (max-width: 767px) {
    .sms_terms{
        font-size: 12px;
    }
    .tyres-columns{
        align-items: center;
    }
    .down-arrows.mobile-down-arrows {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 10px;
    }
    .account-area.step1-section.mobile-step1section .account-area-content h3 {
        align-items: center;
        justify-content: center;
    }
    .down-arrows.mobile-down-arrows img {
        max-width: 20px;
    }
    .blog-single-content {
        padding: 0 0 30px 0;
    }
    .single-feature {
        width: 100%;
        margin-bottom: 30px;
    }
    .roadside-features-section {
        padding: 40px 0;
    }
    .assistance-img {
        width: 100%;
    }
    .assitance-text {
        width: 100%;
    }
    .assistance-img img {
        max-width: 80%;
        margin: 0 auto 40px;
    }
    .assitance-section {
        padding: 50px 0;
    }
    .assitance-text h4 {
        font-size: 20px;
        line-height: 1.4;
        margin-bottom: 15px;
    }
    .single-feature h4 {
    font-size: 20px;
}
.home-banner-text h2 {
    font-size: 1.5rem;
}
.home-banner-text {
    max-width: 300px;
}
section.home-banner {
    min-height: 450px;
}
.account-area.step1-section.rescue .down-arrows {
    display: block;
}
.account-area.step1-section.mobile-step1section.rescue {
    min-height: 350px;
}
}
@media screen and (max-width: 350px) {
    .sms_terms{
        font-size: 10px;
    }
/* new css */
.step-main-repeater > a {
    display: none !important;
}

.cart-holder .form-group:last-child {
    background: red;
    text-align: center;
    background: none;
    font-size: 14px;
}
}

/*Start New Designing*/
.services-main-box{
    background-color: rgba(247, 247, 247, 1);
    border-top-left-radius: 100px;
    border-top-right-radius: 100px;
    padding:3rem 1rem;
}
.service-column h4{
    margin-top: 1rem;
}
.services-header{
    text-align: center;
    margin-bottom: 0rem;
}
.services-header h3, .services-header h4{
    color:rgba(21, 21, 21, 1);
}
.logo-with-text{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    /* margin-top: 1.9rem;    */
}
.logo-with-text h5{
    color: gray;
    font-size: 20px;
    font-weight: 400;
    margin-top: 7px;
}
.gif-logo{
    margin: 3rem 0;
}
.gif-logo img{
    max-width: 100%;
}
#myMap{
    width: 100%;
    height: 400px;
}
.area-viewport{
    background-color: gray;
}
.location-btns-area{
    display: flex;
    justify-content: end;
    flex-direction: column;
    align-items: center;
    height: 100%;
}
.map-box-heading h3{
    font-size: 20px;
    color: #000000;
}
.or-img h2{
    text-align: center;
    color: #000;
    font-weight: 400;
    font-size: 20px;
    text-transform: capitalize;
}
.map-bottom-btns .btn-white{
  background-color: rgba(0, 154, 233, 1) !important;
  border: rgba(0, 154, 233, 1) !important;
  color: white !important;
  font-weight: 500 !important;
  padding: 13px !important;
}
.current-confirm-btn{
    border-radius: 35px !important;
    margin-top: 0 !important;
}
.map-bottom-btns .address-field{
    background: transparent !important;
    border: 2px solid black;
    color: #000 !important;
    font-weight: 500;
    padding: 13px;
}
.dropoff-field::placeholder{
    color: rgba(155, 155, 155, 1) !important;
    font-size: 12px;
}
.dropoff-inner-area p{
    font-size: 14px;
}
.dropoff-inner-area h4{
    margin-bottom: 0 !important;
}
.map-box-heading h6{
    color: rgba(21, 21, 21, 1);
    text-align: center;
    font-size: 18px;
}
.map-bottom-btns{
    margin: 0;
    padding: 1rem 0 0.5rem;
}
.map-box{
    padding: 1rem 1.5rem;
    border-radius: 40px;
    background: linear-gradient(114.08deg, 
        rgba(255, 255, 255, 0.5) -20.87%, 
        rgba(235, 235, 235, 0.367354) 4.42%, 
        rgba(224, 224, 224, 0.287504) 14.59%, 
        rgba(212, 212, 212, 0.21131) 29.42%, 
        rgba(207, 207, 207, 0.175584) 39.74%, 
        rgba(202, 202, 202, 0.143432) 46.67%, 
        rgba(200, 200, 200, 0.126299) 53.14%, 
        rgba(196, 196, 196, 0.1) 63.31%
    );
    margin: 3rem 1.5rem;
}
.custom-form-selection{
  display: flex;
  align-items: center;
}
.custom-form-selection input[type=radio]{
 display: block !important;
}
.custom-form-selection input[type=radio]:checked ~ label {
    border-radius: 5px !important;
    padding: 4px 15px !important;
    color: #000000 !important;
    margin: 0 10px !important;
    cursor: pointer !important;
    border: transparent;
    background-color: transparent !important;
}
.custom-form-selection label{
    border-radius: 5px !important;
    padding: 4px 15px !important;
    color: #000000 !important;
    margin: 0 10px !important;
    cursor: pointer !important;
    border: transparent;
}
.form-box-area{
    justify-content: flex-start;
}
.custom-form-tab-list{
    right: 4.5rem !important;
    left: inherit !important;
}
.vehicle-information-select select{
    background-color: white;
    border-radius: 10px;
    height: 50px;
    color: #9B9B9B;
}
.vehicle-manually-title{
    color: #009AE9 !important;
    text-decoration: none !important;
    border-radius: 25px !important;
    padding: 9px 20px !important;
    border: 1px solid #009AE9 !important;
    width: 100%;
}
.find-vehicle{
    color: gray;
    font-size: 16px;
    text-align: center;
    margin: 20px;
}
.custom-form-fields input{
    border: transparent !important;
    border-radius: 10px !important;
    height: 50px !important;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.1) !important;
    color: black;
}
.custom-phone-fields{
    border: transparent !important;
    border-radius: 10px !important;
    height: 50px !important;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.1) !important;
    color: black;
    background-color: white;
}
.custom-form-fields input::placeholder{
    color: #9B9B9B !important;
}
.rescue-details{
    border: transparent !important;
    border-radius: 10px !important;
    height: 45px !important;
    /* box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.1) !important; */
    padding: 10px;
    width: 100%;
    color: #9B9B9B !important;
    background-color: white !important;
}
.term_service_poilcy, .sms_terms{
    color: #9B9B9B !important;
}
.rescue-details label{
    color: #9B9B9B;
}
.edit-area{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}
.tire-container{
    background-color: #E3F1F8;
    padding: 0.5rem;
}
.total-amount{
    padding: 5px 30px;
    border: 1px dashed #009AE9;
    /* width: 216px; */
    width: 175px;
    margin: 0 auto;
    border-radius: 10px;
    margin-top: 15px;
    margin-bottom: 15px;
    background-color: rgba(241, 241, 241, 1);
}
.coupan-container{
    width: 200px;
    margin: 1rem auto 0;
    text-align: center;
}
.total-amount h3{
    color: #009AE9;
    font-weight: 600;
    font-size: 30px;
    margin-left: 10px;
}
.total-amount h6{
    color: #009AE9;
    font-size: 18px;
    /* margin-left: -1.5rem; */
    margin-left: 1.1rem;
}
.usd-amount{
    font-size:12px;
    vertical-align:top;
    top:1.95em;
    
}
.authorized-btn{
    background-color: #009AE9 !important;
}
/* .custom-tyre-radio{
    background-image: url('../images/emptybox.png') !important;
} */
/* .custom-tyre-radio input[type=radio]:checked ~ label:before{
    background-image: url('../images/custom-radiotype-checked.png') !important;
} */
 .repeater-modal-body{
    background-color: #f7f7f7;
    padding: 2rem 2rem !important;
 }
 .modal-close-btn{
    color: white !important;
    background-color: #009AE9 !important;
    padding: 4px 8px !important;
    border-radius: 60% !important;
 }
 .modal-close{
    top: 5px !important;
 }
 .location-modal .modal-dialog{
    display: flex;
    align-items: flex-end;
    height: 95%;
 }
 .location-modal-rescue-5 .modal-dialog{
    display: flex;
    align-items: flex-end;
    height: 85%;
 }
 .tunning-shop{
    display: flex;
    justify-content: space-between;
    gap: 15px;
 }
 .location-content-body{
    border-radius: 15% !important;
    background-color: #C4C4C4 !important;
 }
 .dropoff-input{
    background-color: white !important;
    text-align: center;
 }
 .btn-outline{
    background-color: transparent !important;
    width: 100%;
    border-radius: 35px;
    padding: 7px 20px;
    border: 2px solid #009AE9 !important;
    color: #009AE9 !important;
    font-size: 18px;
 }
 .garage-item-modal{
    /* background: #323334 !important; */
    padding: 3rem;
    border-radius: 40px !important;
    background-color: rgba(50, 51, 52, 0.75) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
 }
 .garage-content{
    color: white !important;
 }
 /* .garage-content h4{
    color: white !important;
 } */
 /* .quantity{
    background: #6F6F6F;
    height: 50px;
 } */
  .quantity{
   color: #000;
  }
 .custom-quantity{
    background: #6F6F6F;
    height: 50px;
    color: white !important;
 }
 .quantity:after{
    bottom: -12%;
 }
 .quantity:before{
    bottom: -12%;
 }
 .quantity:before,  .quantity:after{
    position: absolute;
    right: 15px;
    font-size: 24px;
    bottom: 10%;
    height: 100%;
    background: #323334;
    width: 46px !important;
    height: 38px !important;
    text-align: center !important;
    border-radius: 39% !important;
}
.quantity:before,  .quantity:after{
    position: absolute;
    right: 15px;
    font-size: 24px;
    bottom: 10%;
    height: 100%;
    background: transparent;
    width: 46px !important;
    height: 38px !important;
    text-align: center !important;
    border-radius: 39% !important;
}
.custom-quantity:before,  .custom-quantity:after{
    position: absolute;
    right: 15px;
    font-size: 24px;
    bottom: 10%;
    height: 100%;
    background: #323334;
    width: 46px !important;
    height: 38px !important;
    text-align: center !important;
    border-radius: 39% !important;
}
.btn-close{
    background-color: #323334;
    display: block;
    width: 100%;
    border-radius: 25px;
    padding: 9px 20px;
    color: #fff !important;
    font-size: 18px;
}
.results-selection{
    display: flex;
    gap: 0 15px;
}
.quantity input:last-child{
    right: 17px !important;
}
.quantity input:first-child{
    left: 20px !important;
}
.modal-radius{
    border-radius: 50px !important;
}
/* .blurred-background{
    background-color: rgba(255, 255, 255, 0.5) !important;
    -webkit-backdrop-filter: blur(5px) !important;
    backdrop-filter: blur(10px) !important;
} */
.body-bg{
    background-color: transparent !important;
}
.drop-off-modal-inner{
    background-color: rgba(255, 255, 255, 0.4) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
}
.height-transparent-modal{
    background-color: rgba(50, 51, 52, 0.7) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
    padding: 3rem 1rem !important;
}
.animated-gif{
    display: flex;
    justify-content: center;
    margin-top: 0;
    margin-bottom: 1.2rem;
}
/* .animated-gif img{
    max-width: 75%;
    animation: inherit !important;
} */
.step1-section.mobile-step1section{
    background-color: rgba(254, 254, 254);
}
body{
    font-family: "Roboto", sans-serif !important;
}
/* #battery_model{
    background-color: #f7f7f7;
} */
 .modal-background{
    background-color: #f7f7f7 !important;
 }
.steps-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    width: 80%;
    top: 1rem;
    left: 2rem;
    background-color: #f7f7f7;
    z-index: 1;
    margin: 0 auto;
}
.steps-header-ls{
    display: flex;
    gap: 20px;
    align-items: center;
}
.steps-header-ls img{
    margin-top: 7px;
}
.page-title h5{
    font-weight: 500;
    /* font-size: 22px; */
    font-size: 18px;
}
.modal-header h5{
    font-weight: 500;
    font-size: 22px;
}
.steps-header-rs h5{
    font-size: 18px;
}
.animated-gif img{
    animation: inherit !important;
}
.btn-next-okay {
    background-color: #009AE9;
    display: block;
    width: 100%;
    border-radius: 25px;
    padding: 9px 20px;
    color: #fff !important;
    font-size: 18px;
}
.manually-add-details label{
    margin-top: 0.5rem;
}
.manually-details-footer{
    margin-top: 1rem;
}
.contact-fn-top{
 margin-top: 3rem;
}
.steps-header-rs{
 display: flex;
 gap: 10px;
 color: black;
 margin-bottom: 2px;
}
.submitted-fields label{
    color: #000;
}
.edit-area{
    position: absolute;
    right: 5rem;
    top: 1.2rem;
}
.right-tyre-fields{
    padding-left: 0 !important;
    text-align: center;
}
.right-tyre-fields::before{
    left:inherit !important;
    top: 10px !important;
    right: -18px !important;
}
.left-tyre-fields{
    text-align: center;
}
.left-tyre-fields::before{
    left: 8px !important;
    top: 0.7rem !important;
}
.custom-tyres{
    position: relative;
}
.car-inspection-tyres{
    justify-content: center;
}
.left-front-tire, .left-bottom-tire, .right-front-tire, .right-bottom-tire{
    position: absolute;
}
.left-front-tire{
    left: 1rem;
    top: 6rem;
}
.left-bottom-tire{
    bottom: 6.5rem;
    left: 1rem;
}
.right-front-tire{
    top: 6rem;
    right: 2rem;
}
.right-bottom-tire{
    bottom: 6.5rem;
    right: 2rem;
}
.feet-unit{
    position: absolute;
    margin-left: 40px;
    font-size: 14.5px;
    margin-top: 1px;
}
/* .card-details{
    margin-top:-17px;
} */
.account-area:before {
    content: "";
    position: absolute;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
}
.logo-preloader{
    width: 10%;
}
.radio-layout{
    margin-bottom: 0 !important;
}
.info-inner-data{
    margin-left: 13px;
}
.steps-side{
    padding: 25px 0 !important;
}
.full-rescue-next{
    font-size: 14px !important;
}
.manually-add-vehicle{
    font-size: 14px !important;
    border-radius: 1px solid #009AE9 !important;
    font-weight: 400 !important;
}
.terms-flex{
    display: flex;
    /* align-items: center; */
    align-items: flex-start;
}
.termsinput{
    margin-bottom: -2px !important;
}
.rescue-edit-screen b{
    font-weight: 400 !important;
}
.authorization-box{
    width: 15px !important;
}
.authorization-privacy a, .authorization-privacy label{
    font-size: 14px !important;
}
.authorization-screen-logo{
    width: 65px;
}
.authorization-top{
    margin-top: 2rem !important;
}
.authorization-hold-heading{
    margin-top: -8px;
}
.payment-para{
    margin-top: 2px !important;
}
.total-amount h6{
    font-size: 12px;
    font-weight: 500;
    margin-top: 2px;
}
.second-screen-box{
    background-color: rgba(255, 255, 255, 0.4) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
    left: 50% !important;
    transform: translate(-50%, -100%) !important;
    position: absolute !important;
    /* width: 23.5% !important; */
    width: 21.5% !important;
    border-radius: 55px !important;
}
/* .job-screen-box{
    transform: translate(-50%, -120%) !important;
} */
.job-screen-box{
    transform: translate(-50%, -48.5vh) !important;
    padding: 0.5rem 1.5rem 0.2rem !important;
}
.second-screen-heading{
    text-align: center;
}
.or-second-screen{
    margin: 7px 0;
}
.correct-location{
    font-weight: 600 !important;
    font-size: 17px !important;
}
.correct-location-para{
    font-size: 13px !important;
}
.selected-location{
    border: transparent !important;
    border-radius: 10px !important;
    padding: 10px 15px;
    width: 100%;
    background-color: white !important;
    margin-top: 15px;
}
.location-icon-box{
    display: flex;
    gap: 10px;
    align-items: center;
}
.selected-location h4{
    font-size: 14px !important;
    color: #000000;
    margin-top: 5px;
}
.confirm-location-btn{
    padding-top: 15px;
}
.confirm-location-btn button{
    font-size: 16px;
}
.track-rescue{
    left: 50% !important;
    transform: translate(-50%, 0%) !important;
    position: absolute;
    z-index: 6;
    background-color: transparent !important;
}
.track-rescue h2{
    color: black !important;
    font-size: 22px;
}
.steps-bar{
    position: absolute;
    width: 85%;
    z-index: 7;
    transform: translate(-50%, 85%) !important;
    left: 50%;
    background-color: rgba(255, 255, 255, 0.4) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
    border-radius: 20px;
}
.dispatching-link{
    position: absolute;
    z-index: 8;
    text-align: center;
    left: 50% !important;
    transform: translate(-50%, 320%) !important;
    font-size: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
}
/* .dispatching-link{
    background-color: rgba(139, 139, 139, 1);
    color: white;
    border-radius: 20px;
    padding: 10px 15px;
} */
.dispatch-linkcolor{
    background-color: rgba(139, 139, 139, 1);
    color: white;
    border-radius: 20px;
    padding: 10px 15px;
}
.dispatch-info-icon{
    background-color: rgba(139, 139, 139, 1);
    padding: 3px 12px;
    border-radius: 15px;
}
.toggle-hidden{
    display: none !important;
}
.dispatch-info-icon i{
    color: white;
}
.steps-bar-step:not(:first-child)::after{
    background-color: rgba(0, 154, 233, 1);
}
.dispatching-box h6, .dispatching-box h3 {
  color: #000 !important;
}
.record-area{
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: center;
    text-align: center;
}
.job-type{
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    margin-top: 10px;
    text-align: center;
}
.job_id h6, .job_id h3, .job_selection h6, .job_selection h3, .job_eta h6, .job_eta h3{
    color: #000 !important;
}
.job_id h6, .job_selection h6, .job_eta h6{
    font-size: 16px;
}
.job_id h3, .job_selection h3, .job_eta h3{
    font-weight: 600 !important;
    font-size: 20px;
}
.dispatching-box h3{
    font-weight: 600 !important;
    font-size: 24px;
    margin-top: 3px;
}
.job-box{
    margin: 0 auto !important;
    padding-top: 10px !important;
}
.job-box button{
    padding: 8px 13px !important;
    font-size: 14px !important;
}
.job-type, .job_id, .job_selection{
    position: relative;
}
.lineadd::after {
    top: 25%;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 1px;
    background-color: gray;
    height: 59%;
    right: -23px;
}
.dispatch-box-spacing{
    padding: 2rem;
}
.dispatch-line::after{
    position: absolute;
    width: 111%;
    height: 1px;
    background-color: rgba(155, 155, 155, 0.6);
    content: " ";
    top: 60px;
}
.cancel-dispatching{
    padding: 2rem 0 0;
    display: flex;
    justify-content: center;
}
.cancel-dispatching button{
    font-size: 24px;
    color: black;
    font-weight: 600;
    border: transparent;
    background-color: transparent;
}
.drop-off-heading{
    color: #000000 !important;
}
.edit-rescure-area{
    justify-content: flex-start !important;
    top: 55px !important;
    left: 23px !important;
}
.name-top-space{
    margin-top: 3.5rem !important;
}
.edit-icon::before{
    margin-right: 10px;
    
}
.edit-with-icon{
    font-family: 'Roboto', sans-serif !important;
    font-size: 14px;
    font-weight: 500;
}
/* .track-rescue{
    background-color: rgba(255, 255, 255, 0.4) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    backdrop-filter: blur(8px) !important;
    border-radius: 20px;
} */
.track-rescue{
    background-color: rgba(0, 154, 233, 1) !important;
    width: 100%;
}
.track-rescue h2{
    color: white !important;
}
.just-logo img {
    max-width: 17%;
}
.just-logo .mobile-logo img {
    margin-left: 42%;
}
.vehcile-manually-next{
    font-size: 14px !important;
}
/* .drop-off-location-box .modal-dialog{
    height: 98% !important;
} */
.drop-off-location-box .modal-dialog{
    height: 87vh !important;
}

#editVehicleModal{
    height: fit-content !important;
}
.vehcile-manually-next:active, .vehcile-manually-next:focus, .vehcile-manually-next:visited, .vehcile-manually-next:hover{
    background-color: #009AE9 !important;
    border-color: #009AE9 !important;
}
.vehcile-manually-next{
    border-color: #009AE9 !important;
}
.radio-layout > label{
    margin-bottom: 5px !important;
}
/* .map-height{
    height: 90% !important;
}
.share-location-pop-up{
    transform: translate(-50%, -125%) !important;
} */
/* .share-location-pop-up{
    transform: translate(-50%, -130%) !important;
} */
.share-location-pop-up{
    transform: translate(-50%, -49vh) !important;
}
/* .confirm-box{
    transform: translate(-50%, -130%) !important;
} */
.confirm-box{
    transform: translate(-50%, -45vh) !important;
}
.gm-style .gm-style-iw-tc::after {
    background: transparent !important;
}
.drop-off-close{
    margin-right: 1.5rem !important;
    margin-top: 0.5rem !important;
}
.dispatching-link-bottom{
    background-color: rgba(139, 139, 139, 1);
    color: white;
    border-radius: 20px;
    position: absolute;
    z-index: 8;
    text-align: center;
    /* left: 50% !important; */
    /* transform: translate(-50%, 225%) !important; */
    width: 95%;
    /* margin: 0 auto; */
    padding: 10px 15px;
    border-radius: 30px;
    font-size: 14px;
    top: 19rem;
    left: 0.65rem;
}
.close-dispatch{
    z-index: 1 !important;
}
.dispatch-off-close{
    top: 0 !important;
}
.custom-cancel-button{
    position: absolute !important;
    top: 15.3rem !important;
    right: 25px !important;
    padding: 3px 8px !important;
    border-radius: 15px !important;
    color: rgba(0, 154, 233, 1);
    background-color: rgba(255, 255, 255, 0.9) !important;
}
.info-dispatch-icon{
    transform:translate(-200%,320%);
    background-color: rgba(139, 139, 139, 1);
} 
.second-screen-mb{
    margin: 0 auto !important;
}
.map-height{
    height: calc(100vh - 80px); 
}
/* .site-logo img{
    width: 90px;
} */
.without-bg-gif{
    width: 10% !important;
}
@media only screen and (min-width:576px){
    .height-modal-dialogue{
        max-width: 380px !important;
    }
}
@media only screen and (max-width:767.98px){
    .without-bg-gif{
        width: 40% !important;
    }
    /* .logo-with-text{
        margin-top: 1.9rem;   
    } */
     .logo-with-text{
        padding-top: 1.9rem;   
    }
    .nd-services-row{
        margin-bottom: 0 !important;
    }
    .services-main-box {
        border-top-left-radius: 80px;
        border-top-right-radius: 80px;
    }
    .services-header h3{
       font-size:14px;
       font-weight: 600;
    }
    .services-header h5{
        font-size:11px;
     }
    .gif-logo img{
        max-width: 100%;
    }
    /* .logo-with-text{
        margin-top: 2rem !important;
    } */
    .gif-mbl{
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .just-logo img{
        max-width: 32%;
    }
    .just-logo .mobile-logo img{
        margin-left: 37%;
        margin-top: 17px;
    }
    /* .logo-with-text img{
      max-width: 75% !important;
    } */
    .logo-with-text h5{
        font-size: 14px;
    }
     /* .mbl-animated-gif{
        transform: scale(1.2);
     } */
     /* .mobile-logo{
        margin-right: 4rem;
     } */
      /* .site-logo{
       position: relative !important;
      } */
     .services-main-box {
        padding: 1rem 1rem 0;
        margin-top: 0 !important;
        z-index: 2;
        position: relative;
    }
    .custom-each-service{
        padding-bottom: 0 !important;
    }
    .custom-each-service h4{
        margin-top: 0 !important;
    }
    .custom-each-top{
        padding-top: 5px !important;
    }
    .new-services-area img{
        max-width: 70%;
    }
    /* .services-main-box{
       margin-top: 1rem;
    } */
    /* body{
        overflow-y: hidden !important;
    } */
    .map-box-heading h3 {
        font-size: 16px;
        font-weight: 600;
    }
    .map-box{
        margin: 3rem 0;
    }
    .map-box-heading h6{
        font-size: 16px;
    }
    .map-box{
        width: 85%;
    }
    .map-box-heading{
        text-align: center;
    }
    /* .or-img{
        margin: 0;
    } */
    .location-content-body {
        border-radius: 13% !important;
    }
    .step-form-title p{
      font-size: 11px;
    }
    /* .logo-preloader{
        width: 70%;
    } */
    .logo-preloader{
        width: 40%;
    }
    .steps-header{
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: absolute;
        width: 85%;
        top: 1rem;
        left: 1rem;
        background-color: #f7f7f7;
        z-index: 1;
        margin: 0 auto;
    }
    .second-screen-box{
        width: 90% !important;
    }
    .steps-bar {
        transform: translate(-50%, 125%) !important;
    }
    .track-rescue h2 {
        font-size: 20px !important;
    }
    .track-rescue {
        transform: translate(-50%, 90%) !important;
    }
    .dispatching-link {
        transform: translate(-50%, 380%) !important;
    }
    .job_id h3, .job_selection h3, .job_eta h3 {
        font-weight: 600 !important;
        font-size: 16px;
    }
    .lineadd::after {
        top: 25%;
        bottom: 0;
        position: absolute;
        content: " ";
        width: 1px;
        background-color: gray;
        height: 59%;
        right: -13px;
    }
    .cancel-dispatching button {
        font-size: 21px;
    }
    .job_id h6, .job_selection h6, .job_eta h6 {
        font-size: 14px;
    }
    /* .logo-with-text {
        margin-top: 1,9rem;
    } */
    .road-side-img{
        margin-top: 2px;
    }
    .dispatching-link-bottom{
        background-color: rgba(139, 139, 139, 1);
        color: white;
        border-radius: 20px;
        position: absolute;
        z-index: 8;
        text-align: center;
        /* left: 50% !important; */
        /* transform: translate(-50%, 225%) !important; */
        width: 95%;
        /* margin: 0 auto; */
        padding: 10px 15px;
        border-radius: 30px;
        font-size: 11px;
        top: 16.5rem;
        left: 0.65rem;
    }
    .battery-jump-top{
        margin-top: 3rem;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
    .items-header {
        flex-wrap: wrap;
        gap: 10px;
    }
    .detail-name-mbl{
        text-align: left !important;
    }
    .detail-side-heading h6{
        margin-top: 1rem;
    }
}
@media only screen and (min-width:1024px){
    .animated-gif img{
        max-width: 75%;
        animation: inherit !important;
    }
     
    
}
.drop-off-modal-inner{
    border-radius: 50px !important;
}
.modal-radius{
    border-radius: 50px !important;
}
.confirm-box{
    -webkit-backdrop-filter: blur(35px) !important;
    backdrop-filter: blur(35px) !important;
}
.drop-off-heading{
    color: #000000 !important;
}
.steps-side{
    background-color: #f7f7f7 !important;
}
.new-funnel-next-btn{
    background-color: #009AE9 !important;
}
.radio-layout{
    margin-bottom: 0 !important;
}
.custom-modal-height{
height: inherit !important;
}
.droploc-top-modal .modal-dialog{
    height: inherit !important;
}
.box-contain{
  box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.1) !important;
  background: #ffffff;
  width: 100%;
  border-radius: 10px;
  padding: 15px;
}
.shop-box-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap: 10px;
}
.shop-header h5{
    color:#000000;
    font-size: 20px !important;
}
.shop-btn button{
    border-radius:35px;
    color: rgba(0, 154, 233, 1) !important;
    font-size:14px;
    border: 1px solid transparent;
    padding: 5px 10px;
}
.shop-header p{
    text-align:left !important;
    color:#9B9B9B !important;
    margin-bottom:10px;
}
.rating-point{
    display:flex;
    gap:10px;
    margin-bottom: 10px;
}
.rating-number{
    color:black;
}
.rating-star{
    width:20px;
}
.shop-image img{
    max-width:100%;
}
.mechanic-shop{
    display: none;
}
.mechanic-address{
    margin: 1rem 0 0 0;
}
.mechanic-para{
    margin-bottom: 10px;
}
.shop-btn{
    background: transparent !important;
    background-color: transparent !important;
    cursor: pointer;
    margin-top: 0 !important;
}
.find-shop-text{
    margin-bottom: 5px;
}
.height-shops{
        height: auto;
        overflow: auto;
        max-height: 550px;
        overflow-y: auto;
}
.or-img-area{
    display: flex;
    justify-content: center;
    margin: 5px 0 10px 0;
} 
.Opr{
  margin: 50px;
}
.fetch-shops-box{
    transform: translate(-50%, -90vh) !important;
}
.car-tire-top{
    margin-top: 30px;
}
.me-type-manually::placeholder{
    color: #000 !important;
}
.resuce-detail-modal-body{
    text-align: center;
}
.resuce-detail-modal-body h5{
    font-size: 22px;
    font-weight: 700;
    margin: 0.5rem;
}
.resuce-detail-modal-body p{
    color: rgba(123, 123, 123, 1);
}
#rescuedetailmodal .modal-header{
    border-bottom: none !important;
}
#rescuedetailmodal .modal-footer{
    border-top: none !important;
}
.rescue-track-media{
    text-align: center;
}
.rescue-track-media img{
 width: 100%;
}
.app-detail-area{
    display: flex;
    justify-content: center;
    margin-top: 1rem;
    gap:16px;
}
#rescuedetailmodal .modal-content{
    border-radius: 30px;
}
#exclusiveoffermodal .modal-content{
    border-radius: 30px;
}
#exclusiveoffermodal .modal-header {
    border-bottom: none !important;
}
#exclusiveoffermodal p{
    margin-top: 15px;
    margin-bottom: 15px;
}
#exclusiveoffermodal a{
  max-width: 250px;
  width: 250px;
  margin: 10px auto;
}
.items-header{
    display: flex;
    justify-content: space-between;
}
.items-header h6{
    font-size: 16px;
}
.jump-details{
    color: rgba(0, 154, 233, 1) !important;
    border-bottom: 2px solid rgba(0, 154, 233, 1) !important;
    font-size: 20px;
}
.jump-items-details{
    display: flex;
    gap: 20px;
    align-items: center;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.battery-jump-area{
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.details-data h6{
    text-align: left !important;
}
.single-detail{
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}
.img-contain-area{
    height: auto;
    width: 100%;
    padding: 0;
    max-width: initial;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    top: 50%;
    position: relative;
    text-align: center;
}
.parent-ul {
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
}
.parent-ul:before {
    content: "";
    display: inline-block;
    width: 4px;
    background: #e9e9e9;
    position: absolute;
    left: 21px;
    top: 5px;
    height: calc(100% - 10px);
}
.parent-ul li {
    position: relative;
    padding-left: 32px;
    /* margin-bottom: 10px; */
}
.green-area-inner{
    background-color: lightgreen;
    border-radius: 50%;
    width: 25px;
    height: 25px;
}
.parent-ul .list-area {
    position: absolute;
    left: 10px;
    top: 5px;
}
.lists-inner-data{
    display: flex;
    gap: 15px;
}
.condition-date, .condition-type{
    border-top: 1px solid lightgray;
    /* border-bottom: 1px solid gray; */
    padding-top: 10px;
    padding-bottom: 10px;
}
.condition-type{
    width: 70%;
}
.condition-date{
    width: 30%;
}
.green-area-inner img{
    width: 100%;
    padding: 5px;
}
.green-area-inner i{
    width: 100%;
    padding: 5px;
    color: white !important;
}
.condition-type{
    display: flex;
    gap: 10px;
}
.detail-icon{
    color: rgba(0, 154, 233, 1) !important;
}
.gray-area-inner{
    background-color: lightgray !important;
}
.detail-side-heading h6{
 font-size: 16px;
 text-align: center;
}
.map-box-heading.detail-name-mbl h3{
    font-weight: 500;
    font-size: 18px;
}
.map-box-heading.details-data h6{
  font-size: 18px;
  font-weight: 400;
}
.colored-details{
    color: #009AE9 !important;
}
/*Toggle Start*/
.custom-radio:nth-last-of-type(1) label {
    cursor: pointer;
    position: relative;
    padding-right: 20px; /* Space for the icon */
}

.custom-radio:nth-last-of-type(1) label::after {
    content: '\f078'; /* Unicode for Font Awesome chevron-down */
    font-family: 'Font Awesome 5 Free'; /* Make sure Font Awesome is included in your project */
    font-weight: 900; /* Use the solid version of the icon */
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.3s ease;
}

.custom-radio:nth-last-of-type(1) label[data-icon="up"]::after {
    content: '\f077'; /* Unicode for Font Awesome chevron-up */
}
.custom-radio:nth-last-of-type(1) .special-notes {
    width: 100%;
    opacity: 0;
    transition: height 0.9s ease, opacity 0.9s ease;
    overflow: hidden;
    height: 0;
}

.custom-radio:nth-last-of-type(1) .special-notes.active {
    opacity: 1;
    height: 115px;
}

/*Toggle End*/

/* .swal2-icon.swal2-info {
    border-color: rgba(0, 154, 233, 1) !important;
    color: rgba(0, 154, 233, 1) !important;
}
.swal2-title{
    font-size: 18px !important;
    font-weight: 500;
    text-align: left !important;
}
.swal2-icon{
    width: 32px !important;
    height: 32px !important;
}
.swal2-icon-content{
    font-size: 32px !important;
}
.swal2-content{
    text-align: left !important;
}
.swal2-content h2{
    font-size: 18px;
    font-weight: 500;
}
#swal2-content li{
    list-style: decimal !important;
}
.swal2-content li, .swal2-content p{
    font-size: 16px !important;
} */
/*End New Designing*/
.applePay {
    /*width: 150px;*/  
    height: 50px;  
    display: none;   
    border-radius: 5px;    
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px !important;
    margin-bottom: 10px !important;
    background-image: -webkit-named-image(apple-pay-logo-white); 
    background-position: 50% 50%;
    background-color: black;
    background-size: 60%; 
    background-repeat: no-repeat; 
}
.apple-btn{
    display: none; 
    background: black !important;
    width: 100%;
    border-radius: 25px;
    padding: 7px 20px;
    text-transform: uppercase;
    font-family: 'Arial Bold', sans-serif;
    font-weight: 600;
    text-align: center;
    color: gray;
    border: 1px solid lightgray;
    /*display: flex !important;*/
    display: none;
    justify-content: center;
    align-items: center;
    font-size: 18px !important;
    gap: 5px;
    text-transform: capitalize;
    cursor: pointer;
    height: inherit !important;
    color: white;
}
.apple-btn img{
    width: 30px;
}
.modal.custom-modal.modal-background.show{
    overflow-y: auto !important;
}
.voice-command{
    background: #009AE9;
    color: white;
    width: 35px;
    height: 35px;
    text-align: center;
    border-radius: 50px;
    border-color: rgba(59, 130, 246, 0.2);
    border: 2px solid;
    box-shadow: 0px 4px 25px 0px rgba(0, 0, 0, 0.1) !important;
    z-index: 9999;
}
.voice-command i{
    color: white;
    margin-top: 8px;
}
.voice-command .fa-stop{
   font-size: 15.3px; 
}
.voice-command:hover{
  scale: 1.3;
}
.command-animate {
  position: relative;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.voice-command:hover {
  scale: 1.3;
}
/* .user-command-stop{
   margin-top: 10px !important; 
} */
.pulse-bg {
  position: absolute;
  width: 45px;
  height: 45px;
  background-color: rgba(0, 154, 233, 0.4);
  border-radius: 50%;
  animation: pulse 1.5s infinite ease-in-out;
  z-index: 0;
}
@keyframes pulse {
  0% {
    transform: scale(1);
    opacity: 0.6;
  }
  50% {
    transform: scale(1.5);
    opacity: 0.2;
  }
  100% {
    transform: scale(1);
    opacity: 0.6;
  }
}