@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    font-family: "Poppins", sans-serif;
}

body {
    overflow-x: hidden;
}

main {
    overflow: hidden;
}

main.green-bg {
    background: linear-gradient(to right, #f0fdf4, #eff6ff) !important;
}

a {
    text-decoration: none;
    transition: all .3s ease-in-out;
}

:root {
    --main-color: #1d4ed8;
}


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

::-webkit-scrollbar-thumb {
    background: var(--main-color);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: #151C22;
}

figure {
    margin: 0;
}

ul,
ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
    letter-spacing: 0px;
    word-spacing: 0px;
    color: #111827;
}

p {
    font-family: 'Poppins', sans-serif;
    color: #4B5563;
    font-size: 18px;
    line-height: 30px;
    text-transform: unset;
    font-weight: 400;
    margin: 0;
    padding: 0;
    letter-spacing: 0px;
    word-spacing: 0px;
}

p::first-letter {
    text-transform: capitalize;
}

/* i::before {
    font-family: "Font Awesome 6 pro";
} */

/* go to top start */
.go-top {
    position: fixed;
    bottom: 7%;
    right: 1%;
    padding: 0;
    display: none;
    cursor: pointer;
    -webkit-font-smoothing: antialiased;
    z-index: 10000;
}

.go-top:after {
    font-family: "Font Awesome 6 Pro";
    content: "\f106";
    color: #fff;
    font-size: 25px;
    transition: all 0.2s ease-in-out;
    height: 50px;
    width: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    border: 2px solid #fff;
    background-color: #0182b5;
}

/* go to top close */

/* go to top */
.scroll-to-top {
    width: 50px;
    height: 50px;
    background: var(--main-color);
    position: fixed;
    bottom: 88px;
    right: 40px;
    z-index: 99;
    text-align: center;
    -webkit-transition: .4s;
    transition: .4s;
    display: none;
    border-radius: 50%;
    cursor: pointer;
}

.scroll-to-top i {
    color: #fff;
    font-size: 18px;
    line-height: 50px;
    -webkit-transition: .4s;
    transition: .4s;
}

/* go to top */
/**************************** Btn hover Start ***************************/
/* .btn {
    font-family: 'DM Sans', sans-serif;
    border-radius: 0px;
    padding: 0;
    margin: 0;
    position: relative;
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    flex-direction: row;
    gap: 20px;
    transition: all .3s ease-in-out;
}

.btn:focus {
    outline: none;
    box-shadow: none;
}

button:focus {
    outline: none !important;
    box-shadow: none !important;
}

.btn-box {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    flex-direction: row;
    gap: 12px;
}

.btn-box .icon-wh {
    width: 25px;
    height: 25px;
    border-radius: 2px !important;
}

.btn-box .btn-primary {
    position: relative;
    font-size: 15px;
    font-weight: 500;
    line-height: 18px;
    font-family: 'DM Sans', sans-serif;
    text-transform: capitalize;
    color: #fff;
    background-color: #ff5722;
    border-radius: 0px;
    border: 1px double #ff5722;
    overflow: hidden;
    transition: all .3s ease-in-out;
}

.btn-box .btn-primary:hover {
    background-color: #ff5722;
}

.btn-box .btn-secondary {
    position: relative;
    font-size: 15px;
    font-weight: 500;
    line-height: 18px;
    font-family: 'DM Sans', sans-serif;
    text-transform: capitalize;
    color: #fff;
    background-color: #7c65ff;
    border-radius: 0px;
    border: 1px double #7c65ff;
    overflow: hidden;
    transition: all .3s ease-in-out;
}

.btn-box .btn-secondary:hover {
    background-color: #7c65ff;
}

.btn-box .btn-icon {
    color: #232F3F;
} */

/* Bounce To Right */
/* .hvr-bounce-to-right {
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.hvr-bounce-to-right:after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.hvr-bounce-to-right:hover,
.hvr-bounce-to-right:focus,
.hvr-bounce-to-right:active {
    color: #ff5722 !important;
}

.hvr-bounce-to-right:hover:after,
.hvr-bounce-to-right:focus:after,
.hvr-bounce-to-right:active:after {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
    transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
} */

/* Bounce To Right */
/* Bounce To left */
/* .hvr-bounce-to-left {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.hvr-bounce-to-left::after {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.hvr-bounce-to-left:hover,
.hvr-bounce-to-left:focus,
.hvr-bounce-to-left:active {
    color: #7c65ff !important;
}

.hvr-bounce-to-left:hover::after,
.hvr-bounce-to-left:focus::after,
.hvr-bounce-to-left:active::after {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
    transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
} */

/* Bounce To left */
/**************************** Btn hover Close ***************************/

/**************************** Form css Start ***************************/
.form-control::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: #313747;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.48px;
    opacity: 0.9;
}

.form-control::-moz-placeholder {
    /* Firefox 19+ */
    color: #313747;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.48px;
    opacity: 0.9;
}

.form-control:-ms-input-placeholder {
    /* IE 10+ */
    color: #313747;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.48px;
    opacity: 0.9;
}

.form-control:-moz-placeholder {
    /* Firefox 18- */
    color: #313747;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.48px;
    opacity: 0.9;
}


textarea:focus,
input:focus {
    outline: none !important;
    box-shadow: none !important;
    border-color: #3063FF !important;
}

.input-main {
    margin: 0 0 18px 0;
    overflow: hidden;
}

.input-main p,
.input-main label {
    font-weight: 400;
    font-size: 16px;
    text-transform: capitalize;
    margin: 0 0 3px 0;
    padding: 0;
    color: #313747;
    line-height: 24px;
}

.input-main p span,
.input-main label span {
    color: #3063FF;
}

.input-main .form-group {
    position: relative;
}

.input-main .form-group .card-imgs {
    z-index: 2;
    position: absolute;
    top: 0;
    left: 20px;
    color: #74769E;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    flex-wrap: nowrap;
    flex-direction: row;
    gap: 3px;
}

.input-main .form-group .card-imgs li img {
    min-width: 26px;
    max-width: 26px;
    min-height: 26px;
    max-height: 26px;
    object-fit: contain;
}

.input-main .form-control.img-bx {
    padding: 12px 20px 12px 60px;
}

.input-main.rightOne .form-control.img-bx {
    padding: 12px 60px 12px 12px;
}

.input-main.rightOne .form-group .card-imgs {
    right: 20px;
    left: inherit;
}

.input-main .form-select,
.input-main .form-control {
    font-family: 'DM Sans', sans-serif;
    border: none;
    height: auto;
    background-color: #fff;
    border: 1px solid var(--Light-Grey, #D2D2D2);
    border-radius: 5px;
    padding: 8px 30px 8px 17px;
    color: #232F3F;
    font-size: 17px;
    font-weight: 400;
    position: relative;
}

.input-main .form-group .field-icon1 {
    z-index: 2;
    position: absolute;
    top: 0;
    right: 10px;
    color: #313747;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.input-main .form-group .field-icon1.fa-eye:before,
.input-main .form-group .field-icon1.fa-eye-slash:before {
    font-family: "Font Awesome 6 pro";
}

.input-main .forgot {
    text-align: right;
    color: #313747;
    margin: 10px 0 0 0;
    font-family: 'DM Sans', sans-serif;
    font-size: 15px;
    line-height: 18px;
    text-transform: unset;
    font-weight: 400;
    display: block;
}


.form-check {
    margin: 0;
}

.form-check .form-check-input:checked {
    background-color: #3063FF;
    border-color: #3063FF;
}

.form-check .form-check-input:focus {
    border-color: #3063FF;
    box-shadow: none;
}

.form-check .form-check-label {
    letter-spacing: 1.5px;
    /* font-family: 'DM Sans', sans-serif; */
    text-transform: capitalize;
    margin: 0;
    color: #313747;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    font-family: "Poppins", sans-serif;
}

/**************************** Form css End ***************************/

/************************************* header *************************************/
.navbar-toggler {
    background-color: var(--main-color);
    color: #fff;
    border: none;
}

/* header top */
header {
    transition: all 0.5s ease-in-out;
    overflow: hidden;
    position: sticky;
    top: 0;
    z-index: 9999;
}

/* header-btm */
header .header-btm {
    /* position: sticky; */
    /* top: 0; */
    /* left: 0; */
    /* right: 0; */
    /* width: 100%; */
    /* z-index: 1000; */
    background: #ffffff;
    border-bottom: 1px solid #77777742;
}

header .header-btm .navbar>.container-fluid {
    align-items: center;
}

header .header-btm .navbar {
    padding: 9px 0;
    transition: all 0.3s ease-in-out;
    background: transparent;
    position: relative;
}

header .header-btm.sticky .navbar {
    border-bottom: none !important;
}

header .header-btm .navbar .navbar-nav {
    align-items: center;
    gap: 28px;
}

header .header-btm .navbar .navbar-nav .nav-item {
    position: relative;
}

header .header-btm .navbar .navbar-nav .nav-item .nav-link {
    color: #374151;
    font-size: 15px;
    padding: 0;
    transition: all 0.5s ease-in-out;
    font-weight: 500;
}

header .header-btm .navbar .navbar-nav .nav-item .nav-link:hover {
    color: var(--main-color);
}

header .header-btm .navbar .navbar-brand {
    margin: 0;
    padding: 0;
}

header .header-btm .navbar .navbar-brand .logo {
    min-width: 100%;
    max-width: 100%;
    max-height: 50px;
    min-height: 50px;
    object-fit: contain;
}

header .header-btm .side-ul {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 15px;
    margin: 0;
    padding: 0;
    transition: all 0.3s ease-in-out;
}

header .header-btm .side-ul .sd-li .btn-started {
    font-size: 16px;
    color: #fff;
    text-transform: capitalize;
    background: var(--main-color);
    border: 1px solid var(--main-color);
    font-weight: 500;
    padding: 11px 21px;
    margin: 0;
    line-height: 20px;
    border-radius: 10px;
}

header .header-btm .side-ul .sd-li .btn-started.green-color {
    background-color: #15803D;
}

.green-color:hover {
    background-color: #166534 !important;
}

header .header-btm .side-ul .sd-li .btn-started:hover {
    background: #1E40AF;
}

header .header-btm .side-ul .sd-li a {
    color: #4b5563;
    font-size: 15px;
    font-weight: 500;
}

header .header-btm .side-ul .sd-li a i {
    font-size: 18px;
}

/***************************** header close *****************************/
/***************************** Footer Start *****************************/
footer {
    position: relative;
    overflow: hidden;
    margin: 0;
    padding: 30px 0px;
    background: #111827;
}

footer .footer-top {
    padding: 50px 0;
}

footer .footer-top .footer-logo img {
    height: 65px;
    object-fit: contain;
    margin: 0px 0px 20px;
}

footer .footer-top .footer-logo p {
    font-size: 15px;
    line-height: 25px;
    color: #9097A3;
}

footer .footer-top .footer-logo ul {
    margin: 23px 0 0 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    flex-direction: row;
    gap: 18px;
}

footer .footer-top .footer-logo ul li a i {
    font-size: 20px;
    color: #9097A3;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    transition: all .5s ease-in-out;
    font-weight: 200;
}

footer .footer-top .footer-logo ul li a i:hover {
    color: #60A5FA;
}

footer .footer-top .quik-inks.last {
    width: 230px;
}

footer .footer-top .quik-inks.last ul li a:hover {
    color: #9097A3;
}

footer .footer-top .quik-inks.last ul li i,
footer .footer-top .quik-inks.last ul li a i {
    font-size: 18px;
    font-weight: 400;
    color: #60A5FA;
}

footer .footer-top .quik-inks h4 {
    font-size: 18px;
    color: #E8E8E8;
    text-transform: capitalize;
    margin: 0 0 20px 0;
}

footer .footer-top .quik-inks h5 {
    font-size: 20px;
    color: #E8E8E8;
    text-transform: uppercase;
    margin: 0 0 30px 0;
}

footer .footer-top .quik-inks p {
    color: #E8E8E8;
    font-size: 18px;
    text-transform: capitalize;
    margin: 0;
    padding: 0;
    letter-spacing: 0px;
    word-spacing: 0px;
}

footer .footer-top .quik-inks ul {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 15px;
}

footer .footer-top .quik-inks ul li,
footer .footer-top .quik-inks ul li a {
    color: #9097A3;
    font-size: 15px;
    text-transform: capitalize;
    margin: 0;
    padding: 0;
    letter-spacing: 0px;
    word-spacing: 0px;
    transition: all 0.5s ease-in-out;
    display: flex;
    gap: 10px;
}

footer .footer-top .quik-inks ul li a:hover {
    color: #fff;
}

footer .footer-bottom {
    padding: 22.8px 0 27.7px;
    border-top: 1px solid #1f2937;
}

footer .footer-bottom .copyright p {
    color: #9097A3;
    font-size: 14px;
    text-transform: capitalize;
}

footer .footer-bottom .copyright p a {
    color: #FAFBFD;
}

footer .footer-bottom .copyright p a:hover {
    color: #002f8c;
}

footer .footer-bottom .privacy-links ul {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    flex-direction: row;
    gap: 10px;
}

footer .footer-bottom .privacy-links ul li {
    color: #FAFBFD;
}

footer .footer-bottom .privacy-links ul li a {
    color: #9097A3;
    font-size: 14px;
    text-transform: capitalize;
    margin: 0;
    padding: 0;
    letter-spacing: 0px;
    word-spacing: 0px;
    transition: all .3s ease-in-out;
}

footer .footer-bottom .privacy-links ul li a:hover {
    color: #ffffff;
}

/*********************** footer close ***********************/

/*********************** Login & Register CSS Start ***********************/
.register-sec-wrap {
    position: relative;
    overflow: hidden;
    margin: 0;
    padding: 50px 0;
}

.register-sec-wrap .form-main {
    padding: 20px 20px;
    border-radius: 8px;
    box-shadow: 0px 0px 4px 0.5px #ccc;
}

.register-sec-wrap .form-main .heads {
    margin: 0 0 50px 0;
}

.register-sec-wrap .form-main .heads h6 {
    font-weight: 700;
    color: #000;
    text-transform: capitalize;
    margin: 0 0 10px 0;
    padding: 0;
    text-align: center;
    font-size: 30px;
}

.register-sec-wrap .form-main .heads p {
    font-size: 18px;
    line-height: 21px;
    font-weight: 400;
    text-align: center;
    text-transform: unset;
    margin: 0;
    padding: 0;
    color: rgba(31, 31, 31, 0.5);
}

.register-sec-wrap .form-main .btn-grp {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 40px 0 40px 0;
}

.register-sec-wrap .form-main .btn-grp .sign-up-btn {
    color: #1F1F1F;
    height: 55px;
    width: 48%;
    font-weight: 400;
    font-size: 16px;
    text-transform: capitalize;
    margin: 0;
    padding: 0 0 0 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(31, 31, 31, 0.5);
    background: #fff;
    transition: all 0.2s ease-in-out;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
}

.register-sec-wrap .form-main .btn-grp .sign-up-btn::before {
    content: '';
    position: absolute;
    top: 12px;
    left: 20%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    height: 25px;
    width: 25px;
}

.register-sec-wrap .form-main .btn-grp .sign-up-btn:nth-child(1)::before {
    background-image: url(../images/google.png);
}

.register-sec-wrap .form-main .btn-grp .sign-up-btn:nth-child(2)::before {
    background-image: url(../images/facebook.png);
    left: 18%;
}

.register-sec-wrap .form-main .input-main label {
    font-weight: 700;
    font-size: 16px;
    text-transform: capitalize;
    margin: 0;
    padding: 0;
    color: #000;
}

.register-sec-wrap .form-main .input-main .fm-ctl {
    border: none;
    height: 45px;
    background-color: #F5F5F7;
    border-radius: 0;
    margin: 10px 0 20px 0;
    padding: 12px 20px;
    color: rgba(31, 31, 31, 0.85);
    font-size: 14px;
    font-weight: 400;
    position: relative;
}

.register-sec-wrap .form-main .input-main {
    position: relative;
}

.field-icon1 {
    /* float: right;
  margin-left: -25px;
  margin-top: -25px;
  position: relative; */
    z-index: 2;
    position: absolute;
    top: 66%;
    right: 20px;
    color: #CB9274;
}

.register-sec-wrap .form-main .submit-btn {
    color: #fff;
    height: 45px;
    width: 99%;
    font-weight: 500;
    font-size: 16px;
    text-transform: capitalize;
    margin: 0 auto;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #CB9274;
    background: #CB9274;
    transition: all 0.2s ease-in-out;
    border-radius: 0;
    overflow: hidden;
    box-sizing: content-box;
}

.register-sec-wrap .form-main p {
    color: #1F1F1F;
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
    text-align: center;
    margin: 35px 0 0 0;
}

.register-sec-wrap .form-main p .link {
    color: #CB9274;
    text-decoration: underline;
    background: #fff;
    border: none;
}

.register-sec-wrap .form-main .extra {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
}

.register-sec-wrap .form-main .extra {
    margin: 30px 0;
}

.register-sec-wrap .form-main .extra .form-check .form-check-input:checked {
    background-color: #CB9274;
    border: #CB9274;
}

.register-sec-wrap .form-main .extra .form-check .form-check-label {
    color: #000;
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
    margin: 0;
}

.register-sec-wrap .form-main .extra .anchor {
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
    color: #CB9274;
    text-decoration: underline;
}

/*********************** Login & Register CSS Close ***********************/

/*********************** home-page css Start ***********************/
/* banner */
.home-banner-wrap {
    padding: 110px 0 100px;
    overflow: hidden;
    position: relative;
    background: #EBF2FF;
}

.home-banner-wrap .content {}

.home-banner-wrap .content .rated {
    margin: 0px 0px 35px;
}

.home-banner-wrap .content .rated span {
    background: #FFEDD5;
    padding: 10px 15px;
    border-radius: 100px;
    color: #9A3412;
    font-size: 14px;
    font-weight: 500;
}

.home-banner-wrap .content .rated span i {}

.home-banner-wrap .content h1 {
    font-size: 60px;
    font-weight: 700;
    color: #111827;
    line-height: 60px;
    margin: 0px 0px 25px;
}

.home-banner-wrap .content h1 span {
    display: block;
    color: var(--main-color);
}

.home-banner-wrap .content p {
    margin: 0px 0px 25px;
    width: 90%;
}

.home-banner-wrap .content .two-btn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
    margin: 0px 0px 30px;
}

.two-btn .book-btn {
    background: var(--main-color);
    color: #fff;
    padding: 18px 30px;
    font-size: 17px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 11px;
    transition: all 0.3s ease-in-out;
}

.two-btn .book-btn i {
    font-weight: 300;
}

.head-box .menu-box .offcanvas-main .offcanvas-body .sign-btn:hover,
.start-btn .request-btn:hover,
.two-btn .book-btn:hover {
    background: #1E40AF !important;
    color: #fff;
    transform: translateY(-4px);
}

.two-btn .book-btn.quote-btn {
    background-color: transparent;
    border: 2px solid #77777759;
    color: #111827;
}


.two-btn .book-btn.quote-btn:hover {
    transform: translateY(0);
    background-color: #fff !important;
    border: 2px solid #777777c0 !important;
}

.home-banner-wrap .content h6 {
    color: #4B5563;
    font-size: 14px;
    font-weight: 400;
}

.home-banner-wrap .content h6 i {
    font-size: 20px;
}

.home-banner-wrap .main-img {
    border-radius: 20px;
}

.home-banner-wrap .main-img img {
    border-radius: 20px;
    height: 420px;
    object-fit: cover;
}

/* banner */
/* services-sec */
.services-sec {
    padding: 100px 0px;
}

.head {
    text-align: center;
    margin: 0px 0px 60px;
}

.head h2 {
    font-size: 35px;
    font-weight: 700;
    line-height: 45px;
    margin: 0px 0px 15px;
}

.head p {
    width: 60%;
    margin: 0 auto;
}

.services-sec .service-main {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 25px;
}

.services-sec .service-main .service-box {
    border: 1px solid #55555529;
    padding: 25px;
    border-radius: 10px;
    transition: all .3s ease-in-out;
    height: 470px;
}

.services-sec .service-main .service-box:hover {
    border: 1px solid #658bf486;
    transform: translateY(-8px);
    box-shadow: 3px 3px 3px 0px #8080802e;
}

.services-sec .service-main .service-box .icon {
    background: #dbeafe;
    height: 60px;
    width: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    margin: 0px 0px 25px;
}

.services-sec .service-main .service-box .icon svg {
    height: 30px;
    width: 30px;
    color: var(--main-color);
}

.services-sec .service-main .service-box h3 {
    font-size: 18px;
    margin: 0px 0px 18px;
    line-height: 23px;
    color: #111827;
}

.services-sec .service-main .service-box p {
    font-size: 15px;
    margin: 0px 0px 20px;
}

.services-sec .service-main .service-box ul {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
}

.services-sec .service-main .service-box ul li {
    list-style: disc;
    margin-left: 20px;
    font-size: 13px;
    color: #4B5563;
}

.services-sec .service-main .service-box ul li::marker {
    color: var(--main-color);
    font-size: 16px;
}

.services-sec .dimand {
    display: flex;
    align-items: center;
    justify-content: space-around;
    background: #f9fafb;
    padding: 40px 0px;
    border-radius: 15px;
    margin: 60px 0px 0px;
}

.services-sec .dimand .backgroung-check {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
}

.services-sec .dimand .backgroung-check svg {
    height: 32px;
    width: 32px;
    color: #16A34A;
}

.services-sec .dimand .backgroung-check h6 {
    font-size: 15px;
    text-align: center;
    line-height: 19px;
}

.services-sec .dimand .backgroung-check span {
    display: block;
    font-size: 13px;
    color: #777;
    font-weight: 400;
}

/* services-sec */
/* available-sec */
.available-sec {
    position: relative;
    padding: 100px 0px;
    overflow: hidden;
}

.available-sec .head {}

.available-sec .head h2 {}

.available-sec .head h2 span {
    display: block;
    color: var(--main-color);
}

.available-sec .head p {}

.available-sec .city-list {
    background: #E8EFFF;
    padding: 30px;
    border-radius: 20px;
    margin: 0px 0px 60px;
}

.available-sec .city-list h4 {
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    margin: 0px 0px 20px;
}

.available-sec .city-list ul {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.available-sec .city-list ul li {
    text-align: center;
    background: #fff;
    padding: 13px 17px;
    border-radius: 7px;
}

.available-sec .city-list ul li a {
    color: #000000;
    font-size: 15px;
    font-weight: 400;
}

.available-sec .city-list h6 {
    text-align: center;
    font-size: 15px;
    font-weight: 500;
    color: var(--main-color);
    margin: 30px 0px 0px;
}

.available-sec .city-search {
    text-align: center;
}

.available-sec .city-search h4 {
    font-size: 16px;
    font-weight: 500;
    margin: 0px 0px 10px;
}

.available-sec .city-search p {
    font-size: 14px;
    margin: 0px auto 30px;
    width: 70%;
    display: flex;
    justify-content: center;
    line-height: 23px;
    align-items: flex-start;
}

.available-sec .city-search p i {
    color: var(--main-color);
    font-size: 23px;
}

.start-btn {
    display: flex;
    align-items: center;
    justify-content: center;
}

.start-btn .request-btn {
    background: var(--main-color);
    color: #fff;
    padding: 16px 28px;
    border-radius: 6px;
    font-size: 17px;
    font-weight: 500;
    transition: background 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    transition: all 0.3s ease-in-out;
}

.start-btn .request-btn i {
    font-weight: 400;
}

/* available-sec */

/* transparent-sec */
.transparent-sec {
    padding: 100px 0px;
    background: #F4F8FE;
}

.transparent-sec .head {}

.transparent-sec .head h2 {}

.transparent-sec .head p {}

.transparent-sec .delivery-box {
    border: 2px solid #8f8f8f4d;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0px 3px 3px 0px #80808061;
    transition: all 0.3s ease;
    background: #fff;
    height: 520px;
}

.transparent-sec .delivery-box:hover {
    box-shadow: 0px 7px 10px 0px #80808061;
}

.transparent-sec .delivery-box h3 {
    font-size: 24px;
    font-weight: 700;
    margin: 0px 0px 10px;
}

.transparent-sec .delivery-box h4 {
    font-size: 38px;
    font-weight: 600;
    color: var(--main-color);
    margin: 0px 0px 10px;
}

.transparent-sec .delivery-box h4 span {
    font-weight: 400;
    font-size: 15px;
    color: #777;
}

.transparent-sec .delivery-box h5 {
    font-size: 16px;
    color: var(--main-color);
    margin: 0px 0px 10px;
}

.transparent-sec .delivery-box p {
    font-size: 15px;
    line-height: 25px;
    margin: 0px 0px 16px;
}

.transparent-sec .delivery-box ul {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 15px;
    flex-direction: column;
    margin: 0px 0px 30px;
}

.transparent-sec .delivery-box ul li {
    font-size: 14px;
    color: #4B5563;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
}

.transparent-sec .delivery-box ul li i {
    color: #2BC764;
    font-size: 17px;
    font-weight: 400;
}

.transparent-sec .delivery-box .Quote-btn {
    width: 100%;
    display: block;
    text-align: center;
    border: 2px solid #d1d5db;
    border-radius: 8px;
    padding: 12px 20px;
    color: #374151;
    font-size: 16px;
    font-weight: 500;
}

.transparent-sec .delivery-box .Quote-btn:hover {
    border-color: #93C5FD
}

.transparent-sec .timing-box {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    margin: 70px 0px 0px;
    padding: 30px 20px;
    gap: 0px;
    border-radius: 20px;
}

.transparent-sec .timing-box .flexible {
    text-align: center;
}

.transparent-sec .timing-box .flexible svg {
    width: 50px;
    height: 50px;
}

.transparent-sec .timing-box .flexible h3 {
    font-size: 17px;
}

.transparent-sec .timing-box .flexible p {
    font-size: 14px;
}

/* transparent-sec */

/* customers-sec */
.customers-sec {
    padding: 100px 0px;
    overflow: hidden;
    position: relative;
}

.customers-sec .head {}

.customers-sec .head h2 {}

.customers-sec .head p {}

.customers-sec .customer-review {
    background: #E7EEFF;
    padding: 40px 30px;
    border-radius: 15px;
    transition: all 0.3s ease;
    height: 380px;
}

.customers-sec .customer-review:hover {
    box-shadow: 0px 7px 10px 0px #80808061;
}

.customers-sec .customer-review .icon {
    margin: 0px 0px 20px;
}

.customers-sec .customer-review .icon svg {
    height: 35px;
    width: 35px;
    color: var(--main-color);
}

.customers-sec .customer-review ul {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 3px;
    margin: 0px 0px 14px;
}

.customers-sec .customer-review ul li {}

.customers-sec .customer-review ul li i {
    color: #FACC15;
    font-size: 18px;
}

.customers-sec .customer-review p {
    font-size: 15px;
    line-height: 25px;
    padding: 0px 0px 20px;
}

.customers-sec .customer-review .name {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #e5e7eb;
    padding: 20px 0px 0px;
}

.customers-sec .customer-review .name h4 {
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    color: #111827;
}

.customers-sec .customer-review .name h4 span {
    display: block;
    font-size: 15px;
    color: #777;
    font-weight: 400;
}

.customers-sec .customer-review .name h6 {
    color: var(--main-color);
    font-size: 14px;
}

.rating-box {
    display: flex;
    align-items: center;
    justify-content: space-around;
    background: #F9FAFB;
    padding: 30px;
    border-radius: 10px;
    margin: 70px 0px 0px;
}

.rating-box .completed-job {
    text-align: center;
}

.rating-box .completed-job h2 {
    font-size: 30px;
    color: var(--main-color);
    font-weight: 700;
}

.rating-box .completed-job p {
    font-size: 14px;
}

/* customers-sec */

/*********************** home-page css Close ***********************/

/*********************** inner-page css Start ***********************/
/* growing-businesses */
.growing-businesses {
    position: relative;
    overflow: hidden;
    padding: 160px 0px 0px;
    background: #E9F0FF;
}

.growing-businesses .head {}

.growing-businesses .head .bussines {
    margin: 0px 0px 30px;
}

.growing-businesses .head .bussines span {
    background: #DBEAFE;
    padding: 10px 20px;
    border-radius: 24px;
    color: var(--main-color);
    font-weight: 500;
    font-size: 14px;
}

.growing-businesses .head .bussines span i {
    font-weight: 400;
    font-size: 16px;
    margin: 0px 5px 0px 0px;
}

.growing-businesses .head h2 {
    font-size: 44px;
    line-height: 50px;
    margin: 0px 0px 17px;
}

.growing-businesses .head h2 span {
    display: block;
    color: var(--main-color);
    font-size: 42px;
}

.growing-businesses .head p {
    margin: 0px auto 30px;
}

.growing-businesses .head .start-btn {}

.growing-businesses .head .start-btn .request-btn {}

.growing-businesses .business-img {
    margin: 0px 0px 80px;
}

.growing-businesses .business-img img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    border-radius: 25px;
}

.growing-businesses .delivery-box {
    background: #fff;
    padding: 20px;
    margin: 0px 0px 25px;
    border-radius: 17px;
    height: 200px;
    box-shadow: 0px 3px 3px 0px #80808061;
    transition: all 0.3s ease-in-out;
}

.growing-businesses .delivery-box:hover {
    box-shadow: 0px 7px 10px 0px #80808061;
}

.growing-businesses .delivery-box .svg-box {
    background: #dbeafe;
    height: 50px;
    width: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    margin: 0px 0px 25px;
}

.growing-businesses .delivery-box .svg-box svg {
    color: var(--main-color);
    height: 25px;
    width: 25px;
}

.growing-businesses .delivery-box h3 {
    font-size: 18px;
    font-weight: 500;
    margin: 0px 0px 10px;
    color: #111827;
}

.growing-businesses .delivery-box p {
    font-size: 15px;
    line-height: 25px;
}

/* growing-businesses */

/* our-business */
.our-business {
    background: #E9F0FF;
    padding: 60px 0px;
}

.our-business .box {
    background: #fff;
    padding: 35px;
    border-radius: 20px;
    box-shadow: 0px 3px 3px 0px #80808061;
}

.our-business .box h2 {
    text-align: center;
    font-size: 26px;
    font-weight: 700;
    margin: 0px 0px 50px;
}

.our-business .last-mile {
    border: 1px solid #77777754;
    border-radius: 10px;
    padding: 25px;
    margin: 0px 0px 25px;
    transition: all 0.3s ease-in-out;
}

.our-business .last-mile:hover {
    border-color: #60A5FA;
}

.our-business .last-mile .custom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0px 0px 12px;
}

.our-business .last-mile .custom h3 {
    font-size: 18px;
    font-weight: 500;
}

.our-business .last-mile .custom h6 {
    color: var(--main-color);
    font-size: 15px;
    font-weight: 500;
}

.our-business .last-mile p {
    font-size: 16px;
}

/* our-business */

/* our-partners-sec */
.our-partners-sec {
    background: #E9F0FF;
    padding: 0px 0px 80px;
}

.our-partners-sec .head {
    margin: 0px 0px 15px;
}

.our-partners-sec .head h2 {
    font-size: 28px;
}

.our-partners-sec .partner-box {
    background: #fff;
    padding: 30px;
    border-radius: 15px;
    height: 245px;
    box-shadow: 0px 3px 3px 0px #80808061;
}

.our-partners-sec .partner-box ul {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0px 0px 12px;
}

.our-partners-sec .partner-box ul li {}

.our-partners-sec .partner-box ul li i {
    color: #FACC15;
    font-size: 17px;
}

.our-partners-sec .partner-box p {
    font-size: 15px;
    margin: 0px 0px 20px;
}

.our-partners-sec .partner-box h4 {
    font-size: 16px;
    font-weight: 600;
    line-height: 20px;
    color: #111827;
}

.our-partners-sec .partner-box h4 span {}

.our-partners-sec .partner-box h4 span {
    display: block;
    font-size: 14px;
    color: #777;
    font-weight: 400;
}

.our-business .rating-box {
    background: transparent;
}

/* our-partners-sec */

/* operations-sec */
.operations-sec {
    background: #E9F0FF;
    padding: 0px 0px 80px;
}

.operations-sec .ready-box {
    text-align: center;
    background: linear-gradient(-135deg, #3632A6, #1E4DD6);
    padding: 50px 30px;
    border-radius: 15px;
}

.operations-sec .ready-box h2 {
    color: #fff;
    font-size: 30px;
    font-weight: 600;
    margin: 0px 0px 15px;
}

.operations-sec .ready-box p {
    color: #fff;
    font-size: 18px;
    margin: 0px 0px 20px;
}

.operations-sec .ready-box .today-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.operations-sec .ready-box .today-btn .get-today-btn {
    background: #fff;
    padding: 15px 30px;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 500;
    color: #1D4ED8;
    transition: all 0.3s ease-in-out;
}

.operations-sec .ready-box .today-btn .get-today-btn.sales-btn {
    background: transparent;
    border: 2px solid #fff;
    color: #fff;
}

.operations-sec .ready-box .today-btn .get-today-btn.sales-btn:hover {
    background: #fff;
    color: #1D4ED8;
}

/* operations-sec */


/* drive-your-sec */
.drive-your-sec {
    background: transparent;
}

.drive-your-sec .bussines {}

.drive-your-sec .head .bussines span {
    color: #15803D;
    background: #DCFCE7;
}

.drive-your-sec .head .bussines span i {}

.drive-your-sec .head h2 {}

.drive-your-sec .head h2 span {
    color: #15803D;
}

.drive-your-sec .head .start-btn .request-btn {
    background: #15803D;
}

.drive-your-sec .head .start-btn .request-btn:hover {
    background-color: #166534 !important;
}

/* drive-your-sec */
/* earnings-sec */
.earnings-sec {
    padding: 0px 0px 70px;
}

.earnings-sec .Potential-box {
    background: #fff;
    box-shadow: 0px 5px 10px 0px #80808061;
    padding: 40px 30px;
    border-radius: 20px;
    margin: 0px 0px 60px;
}

.earnings-sec .Potential-box h2 {
    text-align: center;
    font-size: 30px;
    font-weight: 600;
    margin: 0px 0px 30px;
}

.earnings-sec .Potential-box .four-small {
    margin: 0px 0px 40px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.earnings-sec .Potential-box .four-small .hour-box {
    border: 1px solid #E5E7EB;
    text-align: center;
    padding: 30px 24px;
    /* width: 23%; */
    border-radius: 10px;
}

.earnings-sec .Potential-box .four-small .hour-box h3 {
    color: #15803D;
    font-size: 22px;
    font-weight: 600;
    margin: 0px 0px 10px;
}

.earnings-sec .Potential-box .four-small .hour-box h6 {
    font-size: 15px;
    font-weight: 600;
    line-height: 17px;
}

.earnings-sec .Potential-box .four-small .hour-box h6 span {
    display: block;
    font-weight: 400;
    color: #4B5563;
    margin: 10px 0px 0px;
}

.earnings-sec .Potential-box .top {
    background: #F0FDF4;
    padding: 30px;
    text-align: center;
    border-radius: 10px;
    border: 1px solid #BBF7D0;
}

.earnings-sec .Potential-box .top h3 {
    color: #14532D;
    font-size: 23px;
    font-weight: 700;
    margin: 0px 0px 10px;
}

.earnings-sec .Potential-box .top p {
    color: #14532D;
}

.earnings-sec .Potential-box .top p span {
    color: #14532D;
    font-weight: 700;
}

.earnings-sec .competitive {
    background: #fff;
    padding: 25px 38px;
    text-align: center;
    border-radius: 15px;
    box-shadow: 0px 2px 7px 0px #80808061;
}

.earnings-sec .competitive .svg-box {
    height: 60px;
    width: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 15px;
    background: #DCFCE7;
    border-radius: 50%;
}

.earnings-sec .competitive .svg-box svg {
    color: #15803D;
    width: 30px;
    height: 30px;
}

.earnings-sec .competitive h3 {
    font-size: 18px;
    text-align: center;
    margin: 0px 0px 10px;
    font-weight: 600;
}

.earnings-sec .competitive p {
    font-size: 14px;
    line-height: 20px;
    margin: 0px 0px 15px;
}

.earnings-sec .competitive h6 {
    color: #15803D;
    font-size: 14px;
    font-weight: 500;
}

/* earnings-sec */
/* requirements-sec */
.requirements-sec {
    padding: 0px 0px 80px;
}

.requirements-sec .require-box {
    background: #fff;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0px 2px 7px 0px #80808061;
}

.requirements-sec .require-box h2 {
    text-align: center;
    font-size: 30px;
    font-weight: 600;
}

.requirements-sec .require-box h3 {
    text-align: center;
    font-size: 24px;
    font-weight: 500;
    margin: 60px 0px 30px;
}

.requirements-sec .require-box .main-require {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.requirements-sec .require-box .main-require .detail {
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    padding: 20px;
    display: flex;
    align-items: self-start;
    justify-content: flex-start;
    gap: 20px;
}

.requirements-sec .require-box .main-require .detail .svg-box {
    background: #DBEAFE;
    height: 40px;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
}

.requirements-sec .require-box .main-require .detail .svg-box svg {
    color: #2D5BDB;
    height: 25px;
    width: 25px;
}

.requirements-sec .require-box .main-require .detail .txt {}

.requirements-sec .require-box .main-require .detail .txt h4 {
    font-size: 18px;
    font-weight: 500;
    margin: 0px 0px 6px;
}

.requirements-sec .require-box .main-require .detail .txt p {
    font-size: 14px;
    margin: 0px 0px 5px;
}

.requirements-sec .require-box .main-require .detail .txt .requir {}

.requirements-sec .require-box .main-require .detail .txt .requir span {
    color: #991B1B;
    font-size: 12px;
    background: #FEE2E2;
    padding: 5px 10px;
    border-radius: 5px;
}

.requirements-sec .require-box .main-require .detail.helper {
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.detail.helper {}

.requirements-sec .require-box .main-require .detail.helper .svg-box {
    background: #dcfce7;
}

.requirements-sec .require-box .main-require .detail.helper .svg-box svg {
    color: #15803d;
}

.requirements-sec .require-box .main-require .detail.helper .txt .requir span {
    color: #166534;
    background: #dcfce7;
}

.requirements-sec .require-box .note {
    background: #f0fdf4;
    padding: 17px;
    border-radius: 7px;
    margin: 30px 0px 0px;
    border: 1px solid #bbf7d0;
    text-align: center;
}

.requirements-sec .require-box .note p {
    font-size: 14px;
    color: #166534;
}

.requirements-sec .require-box .note p span {
    font-weight: 600;
}

/* requirements-sec */

/* how-works */
.how-works {
    overflow: hidden;
    padding: 0px 0px 80px;
}

.how-works .head {}

.how-works .head h2 {
    text-align: center;
    font-size: 30px;
    font-weight: 600;
}

.how-works .apply {
    text-align: center;
}

.how-works .apply .svg-box {
    height: 60px;
    width: 60px;
    margin: 0 auto 20px;
    background: #DBEAFE;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.how-works .apply .svg-box svg {
    color: #2D5BDB;
    height: 30px;
    width: 30px;
}

.how-works .apply h3 {
    font-size: 16px;
    margin: 0px 0px 15px;
}

.how-works .apply p {
    font-size: 14px;
    line-height: 20px;
}

/* how-works */
/* stories-sec */
.stories-sec {
    background: transparent;
}

.stories-sec .partner-box {
    height: 260px;
}

.stories-sec .partner-box .johnson {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #55555557;
    padding: 20px 0px 0px;
}

.stories-sec .partner-box .johnson h4 {}

.stories-sec .partner-box .johnson h4 span {}

.stories-sec .partner-box .johnson h5 {
    font-size: 16px;
    font-weight: 600;
    color: #15803D;
    line-height: 20px;
}

.stories-sec .partner-box .johnson h5 span {
    display: block;
    font-size: 14px;
    color: #777;
    font-weight: 400;
    text-align: end;
}

/* stories-sec */
/* journey-sec */
.journey-sec {
    background: transparent;
}

.journey-sec .ready-box {
    background: linear-gradient(to right, #15803d, #1e40af);
}

.operations-sec.journey-sec .ready-box .today-btn .get-today-btn {
    color: #166534;
}

.operations-sec.journey-sec .ready-box .today-btn .get-today-btn.sales-btn {
    color: #fff;
}

.operations-sec.journey-sec .ready-box .today-btn .get-today-btn.sales-btn:hover {
    background-color: transparent;
    color: #fff;
}

/* journey-sec */

/* how-those-guy */
.how-those-guy {
    background: #f7f9fc;
    padding: 100px 0px;
}

.how-those-guy .head {}

.how-those-guy .online-box {
    position: relative;
    text-align: center;
    margin: 0px 0px 70px;
}

.how-those-guy .online-box .svg-box {
    width: 75px;
    height: 75px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin: 0 auto 35px;
    border: 4px solid #bfdbfe;
    transition: all .3s ease-in-out;
}

.how-those-guy .online-box:hover .svg-box {
    border-color: #60A5FA;
}

.how-those-guy .online-box .svg-box svg {
    height: 30px;
    width: 30px;
    color: var(--main-color);
}

.how-those-guy .online-box .box {
    background: #fff;
    padding: 30px 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: 0px 6px 11px 1px #80808073;
}

.how-those-guy .online-box .box h3 {
    font-size: 20px;
    font-weight: 600;
    margin: 0px 0px 10px;
}

.how-those-guy .online-box .box p {
    font-size: 15px;
    line-height: 26px;
    margin: 0px 0px 10px;
}

.how-those-guy .online-box .box h6 {
    color: var(--main-color);
    font-size: 14px;
    line-height: 21px;
}

.how-those-guy .online-box .num {
    position: absolute;
    top: 0%;
    right: 0;
    height: 30px;
    width: 30px;
    background-color: #1D4ED8;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.how-those-guy .online-box .num p {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}

section.how-those-guy .row::before {
    content: "";
    height: 2px;
    width: 74%;
    background: linear-gradient(to right, #bfdbfe, #60a5fa, #4ade80);
    position: absolute;
    top: 43%;
    margin: 0 auto;
    left: 13%;
}

section.how-those-guy .row {
    position: relative;
}

/* how-those-guy */
/*********************** inner-page css close ***********************/


/* head-box */
.head-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px 30px;
    border-bottom: 10px solid #E2E8EE;
    position: sticky;
    top: 0px;
    z-index: 9999;
    background: #fff;
}

.head-box .main-img {}

.head-box .main-img img {
    width: 100%;
    height: 40px;
    object-fit: contain;
}

.head-box .menu-box {}

.head-box .menu-box .btn-menu {
    color: var(--main-color);
    font-size: 25px;
    font-weight: 400;
    padding: 0;
    margin: 0;
    height: 50px;
}

.head-box .menu-box .btn-menu:focus {
    border: none !important;
}

.head-box .menu-box .offcanvas-main {
    width: 25%;
}

.head-box .menu-box .offcanvas-main .offcanvas-body {
    padding: 70px 45px;
}

.head-box .menu-box .offcanvas-main .offcanvas-body .head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 15px;
}

.head-box .menu-box .offcanvas-main .offcanvas-body .head img {
    width: 65px;
    height: 65px;
    object-fit: cover;
}

.head-box .menu-box .offcanvas-main .offcanvas-body .head h2 {
    margin: 0;
    font-size: 32px;
    font-weight: 500;
    text-transform: capitalize;
}

.head-box .menu-box .offcanvas-main .offcanvas-body .sign-btn {
    width: 100%;
    background: var(--main-color);
    color: #fff;
    padding: 20px;
    border-radius: 100px;
    margin: 0px 0px 20px;
    font-size: 22px;
    font-weight: 500;
    transition: all .3s ease-in-out;
}

.head-box .menu-box .offcanvas-main .offcanvas-body .sign-btn.log-btn {
    background: #eaefff;
    color: var(--main-color);
}

.head-box .menu-box .offcanvas-main .offcanvas-body .sign-btn.log-btn:hover {
    background-color: #D6DFFF !important;
}

.head-box .menu-box .offcanvas-backdrop.fade.show {
    opacity: 1;
    background: rgba(231, 228, 224, .5) !important;
    backdrop-filter: blur(4px);
}

/* head-box */

/* step-main-sec */
section.step-main-sec {
    background: #FCF9F6;
    position: relative;
    padding: 50px 0px 0px;
    /* height: 100vh; */
}

.delivery-step .modal-body .steps-container {
    background: #fff;
    padding: 60px 70px 30px;
    border-radius: 10px;
}

.delivery-step .modal-body .steps-container .step {
    display: none;
    transition: all 0.3s ease;
}

.delivery-step .modal-body .steps-container .step.active {
    display: block;
}

.delivery-step .modal-body .steps-container .Which-day h2,
.delivery-step .modal-body .steps-container .what-time h2,
.delivery-step .modal-body .steps-container .helpers h2,
.delivery-step .modal-body .steps-container .we-moving h2,
.delivery-step .modal-body .steps-container .add-an-items h2,
.delivery-step .modal-body .steps-container .add-an h2,
.delivery-step .modal-body .steps-container .tell-us h2,
.delivery-step .modal-body .steps-container .where h2,
.delivery-step .modal-body .steps-container h2 {
    text-align: center;
    font-size: 40px;
    font-weight: 600;
    margin: 0px 0px 30px;
}

.delivery-step .modal-body .steps-container .store-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #E2E8EE;
    padding: 30px 50px 30px 30px;
    border-radius: 10px;
    box-shadow: 0px 7px 0px #E2E8EE;
    margin: 0px 0px 20px;
    cursor: pointer;
    transition: all .3s ease-in-out;
}

.delivery-step .modal-body .steps-container .helpers .box.active,
.delivery-step .modal-body .steps-container .helpers .box.pickup.active,
.delivery-step .modal-body .steps-container .store-box.active {
    border: 1px solid #1D4ED8;
    box-shadow: 0px 7px 0px #1D4ED8;
}

.delivery-step .modal-body .steps-container .store-box:hover {
    background-color: #EAEFFF;
}

.delivery-step .modal-body .steps-container .store-box .txt h3 {
    font-size: 20px;
    font-weight: 500;
    color: #1D4ED8;
    line-height: 40px;
    margin: 0px 0px 5px;
}

.delivery-step .modal-body .steps-container .store-box .txt p {
    font-weight: 400;
    font-size: 15px;
}

.delivery-step .modal-body .steps-container .store-box .main-img img {
    width: 100%;
    height: 40px;
    object-fit: contain;
    margin: 0px 0px 7px;
}

.delivery-step .modal-header button.btn-close {
    border: 2px solid #000;
    border-radius: 50%;
    height: 30px;
    width: 30px;
    opacity: 1;
}

.delivery-step .modal-header button.btn-close:hover {
    border: 2px solid #000;
    background-color: transparent;
}

.step-btn-fixed.step-btn {
    position: sticky;
    bottom: 0px;
    background: #fff;
    text-align: center;
    border-top: 1px solid #ddd;
    z-index: 1000;
    display: flex;
    justify-content: center;
    gap: 15px;
    width: 100%;
    padding: 27px;
}

.step-btn-fixed.step-btn .step-next {
    padding: 20px 45px;
    background-color: #1e40af;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    line-height: 20px;
}

.delivery-step .modal-body .steps-container h2 {
    text-align: center;
}
.delivery-step .modal-body .steps-container .where{
    text-align: center;
}
.delivery-step .modal-body .steps-container .where .up-location {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    margin: 0px 0px 20px;
    border: 1px solid #616D80;
    padding: 17px;
    border-radius: 14px;
    box-shadow: 0px 5px 0px #616D80;
}

.delivery-step .modal-body .steps-container .where .up-location img {
    height: 40px;
    width: 40px;
}

.delivery-step .modal-body .steps-container .where .up-location h5 {
    font-size: 24px;
    color: #616D80;
    font-weight: 500;
}

.delivery-step .modal-body .steps-container .where h6 {
    text-align: center;
    font-size: 23px;
    color: var(--main-color);
    font-weight: 600;
    margin: 40px 0px 40px;
}

.delivery-step .modal-body .steps-container .where .ifream-box iframe {
    width: 100%;
}

.delivery-step .modal-body .steps-container .where .main-img{
    text-align: center;
    margin: 40px 0px 20px;
}
.delivery-step .modal-body .steps-container .where .main-img .svg-1 {
    width: 45px;
}

.delivery-step .modal-body .steps-container .where h3 {
    font-size: 21px;
    font-weight: 600;
    text-align: center;
    margin: 0px 0px 20px;
}

.delivery-step .modal-body .steps-container .where p {
    text-align: center;
    font-size: 15px;
    margin: 0px 0px 40px;
}
.delivery-step .modal-body .steps-container .btn-helpe{
    text-align: center;
}
.delivery-step .modal-body .steps-container .help-btn{
    border: 0;
    background: #eaefff;
    padding: 10px 30px;
    border-radius: 100px;
    font-size: 16px;
    font-weight: 500;
    color: var(--main-color);
}

.delivery-step .modal-body .steps-container .add-an .main-input {
    margin: 0px 0px 40px;
}

.delivery-step .modal-body .steps-container .add-an h4 {
    text-align: center;
    font-size: 21px;
    margin: 0px 0px 25px;
    color: #253B54;
}

.delivery-step .modal-body .steps-container .add-an h3 {
    text-align: center;
    font-size: 28px;
    font-weight: 600;
    margin: 0px 0px 40px;
}

.delivery-step .modal-body .steps-container .add-an .items-box {
    margin: 0px 0px 40px;
}

.delivery-step .modal-body .steps-container .add-an .items-box .box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #E2E8EE;
    padding: 13px 25px;
    border-radius: 14px;
    box-shadow: 0px 5px 0px #E2E8EE;
    margin: 0px 0px 10px;
    transition: all .3s ease-in-out;
}

.delivery-step .modal-body .steps-container .add-an .items-box .box:hover {
    box-shadow: 0px 5px 0px var(--main-color);
    border: 1px solid var(--main-color);
    background-color: #EAEFFF;
}

.delivery-step .modal-body .steps-container .add-an .items-box .box h5 {
    font-size: 21px;
    font-weight: 600;
}

.delivery-step .modal-body .steps-container .add-an .items-box .box img {
    height: 50px;
    width: 50px;
}

.delivery-step .modal-body .steps-container .add-an-items .main-input {
    margin: 0px 0px 29px;
}

.delivery-step .modal-body .steps-container .add-an-items h4 {
    text-align: center;
    font-size: 18px;
    margin: 0px 0px 40px;
    color: #2E435B;
    font-weight: 400;
}

.delivery-step .modal-body .steps-container .add-an-items .form-check {
    margin: 0px 0px 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.delivery-step .modal-body .steps-container .add-an-items .form-check .form-check-label {
    font-size: 25px;
    font-weight: 400;
}

.delivery-step .modal-body .steps-container .add-an-items .line {
    height: 2px;
    background: #e2e1e1;
    margin: 0px 0px 50px;
}

.delivery-step .modal-body .steps-container .add-an-items .how-many {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0px 0px 40px;
}

.delivery-step .modal-body .steps-container .add-an-items .how-many h6 {
    font-size: 23px;
    font-weight: 400;
}

.frame {
    display: flex;
    align-items: center;
    gap: 10px;
}

.frame .cir-btn div {
    background: var(--main-color);
    color: white;
    font-size: 30px;
    border-radius: 50%;
    cursor: pointer;
    user-select: none;
    height: 45px;
    width: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.frame .number h1 {
    margin: 0;
    font-size: 26px;
}

.delivery-step .modal-body .steps-container .add-an-items .smoothly {
    background: #FAF8B6;
    border: 1px solid #C85014;
    padding: 10px 15px;
    border-radius: 10px;
    margin: 0px 0px 20px;
}

.delivery-step .modal-body .steps-container .add-an-items .smoothly p {
    color: #C85014;
    font-size: 20px;
    line-height: 30px;
}

.delivery-step .modal-body .steps-container .add-an-items .message {
    margin: 0px 0px 90px;
}

.delivery-step .modal-body .steps-container .add-an-items .message .notes {
    display: block;
    font-size: 23px;
    font-weight: 400;
    margin: 0px 0px 10px;
}

.delivery-step .modal-body .steps-container .add-an-items .message textarea {
    width: 100%;
    padding: 15px;
    border-radius: 10px;
    border: 1px solid #e2e1e1;
    font-size: 22px;
}

.delivery-step .modal-body .steps-container .add-an-items .file-upload-box {
    position: relative;
    display: inline-block;
}

.delivery-step .modal-body .steps-container .add-an-items .file-input {
    display: none;
}

.delivery-step .modal-body .steps-container .add-an-items .file-label {
    border: 2px solid #E2E8EE;
    padding: 30px;
    width: 175px;
    text-align: center;
    cursor: pointer;
    border-radius: 10px;
    background-color: #ffffff;
    transition: all 0.3s ease;
    box-shadow: 7px 7px 0px #E2E8EE;
}

.delivery-step .modal-body .steps-container .add-an-items .file-label:hover {
    border-color: #2563eb;
    box-shadow: 7px 7px 0px #2563eb;
}

.delivery-step .modal-body .steps-container .add-an-items .file-label img {
    width: 50px;
    height: 50px;
    margin-bottom: 10px;
}

.delivery-step .modal-body .steps-container .add-an-items .file-label p {
    margin: 0;
    font-size: 23px;
    color: #3063FF;
    font-weight: 600;
}

.delivery-step .modal-body .steps-container .add-an-items .form-check .form-check-input {
    width: 2em;
    height: 2em;
    border-color: #3063FF;
    border: 3px solid #3063FF;
}

.delivery-step .modal-body .steps-container .helpers.vehicle {
    margin: 40px 0px 0px;
}

.delivery-step .modal-body .steps-container .helpers .box {
    border: 1px solid #E2E8EE;
    padding: 25px;
    border-radius: 10px;
    box-shadow: 0px 8px 0px #E2E8EE;
    margin: 0px 0px 20px;
    transition: all .3s ease-in-out;
}

.delivery-step .modal-body .steps-container .helpers .box:hover {
    background-color: #EAEFFF;
}

.delivery-step .modal-body .steps-container .helpers .box h3 {
    color: #3063FF;
    font-size: 30px;
    margin: 0px 0px 25px;
}

.delivery-step .modal-body .steps-container .helpers .box ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 0px 0px 30px;
}

.delivery-step .modal-body .steps-container .helpers .box ul li p {
    font-size: 22px;
    text-align: start;
    color: #253B54;
    font-weight: 400;
}

.delivery-step .modal-body .steps-container .helpers .box ul li img {
    width: 60px;
    height: 60px;
}

.delivery-step .modal-body .steps-container .helpers .box p {
    text-align: end;
    font-size: 22px;
    color: #000;
}

.delivery-step .modal-body .steps-container .what-time p {
    text-align: center;
    background: #F5F8FC;
    padding: 11px;
    border: 1px solid #E2E8EE;
    border-radius: 8px;
    font-size: 20px;
    margin: 0px 0px 40px;
}

.delivery-step .modal-body .steps-container .what-time h4 {
    font-size: 27px;
    text-align: center;
    color: #253B54;
    margin: 0px 0px 30px;
}

.delivery-step .modal-body .steps-container .what-time .select {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 0px 0px 50px;
}

.delivery-step .modal-body .steps-container .what-time .select .form-select {
    height: 70px;
    text-align: center;
    background: #fff;
    font-size: 23px;
    font-weight: 500;
    border: 1px solid #E1E7ED;
    box-shadow: 0px 6px 0px #E1E7ED;
    border-radius: 10px;
}

.delivery-step .modal-body .steps-container .what-time .select p {
    margin: 0;
    border: 0;
    background: 0;
}

.delivery-step .modal-body .steps-container .review h2 {
    font-size: 42px;
    font-weight: 600;
    margin: 0px 0px 30px;
    color: #011631;
    text-align: left;
}

.delivery-step .modal-body .steps-container .review p {
    font-size: 21px;
    line-height: 31px;
    margin: 0px 0px 20px;
    color: #011631;
}

.delivery-step .modal-body .steps-container .review .store h6 {
    background: #EDF0F7;
    text-align: center;
    padding: 20px;
    font-size: 20px;
    text-transform: uppercase;
    letter-spacing: 4px;
    border-radius: 15px 15px 0px 0px;
}

.delivery-step .modal-body .steps-container .review .store img {
    width: 100%;
}

.delivery-step .modal-body .steps-container .review .included {
    border: 3px solid #E2E8EE;
    border-top: 0;
    padding: 25px;
}

.delivery-step .modal-body .steps-container .review .included h2 {
    font-size: 31px;
    font-weight: 600;
    margin: 0px 0px 24px;
}

.delivery-step .modal-body .steps-container .review .included h6 {
    font-size: 22px;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 600;
}

.delivery-step .modal-body .steps-container .review .included p {
    margin: 15px 0px 0px;
}

.delivery-step .modal-body .steps-container .review .included p i {
    font-size: 18px;
}

.delivery-step .modal-body .steps-container .review .included h6 img {
    height: 30px;
    width: 30px;
}

.delivery-step .modal-body .steps-container .review .included ul {
    display: flex;
    align-items: self-start;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
}

.delivery-step .modal-body .steps-container .review .included ul li {
    font-size: 21px;
    display: flex;
    gap: 15px;
}

.delivery-step .modal-body .steps-container .review .included ul li img {
    height: 30px;
    width: 30px;
}

.delivery-step .modal-body .steps-container .review .guaranteed {
    background: #EDF0F7;
    border: 3px solid #E2E8EE;
    border-top: 0;
    padding: 30px 30px;
    border-radius: 0px 0px 15px 15px;
    margin: 0px 0px 40px;
}

.delivery-step .modal-body .steps-container .review .guaranteed h2 {
    font-size: 31px;
    font-weight: 600;
    margin: 0px 0px 24px;
    border-bottom: 1px solid #cdd3da;
    padding: 0px 0px 24px;
}

.delivery-step .modal-body .steps-container .review .guaranteed .total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0px 0px 9px;
}

.delivery-step .modal-body .steps-container .review .guaranteed .total h6 {
    font-size: 20px;
    font-weight: 300;
}

.delivery-step .modal-body .steps-container .review .guaranteed .Taxes {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0px 0px 40px;
    border-bottom: 1px solid #cdd3da;
    padding: 0px 0px 24px;
}

.delivery-step .modal-body .steps-container .review .guaranteed .Taxes h6 {
    font-size: 20px;
    font-weight: 300;
}

.delivery-step .modal-body .steps-container .review .guaranteed ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0px 0px 40px;
}

.delivery-step .modal-body .steps-container .review .guaranteed ul li {
    font-size: 25px;
    color: #000;
    font-weight: 600;
}

.delivery-step .modal-body .steps-container .review .guaranteed h4 {
    text-align: center;
    font-size: 26px;
    color: var(--main-color);
    font-weight: 600;
}

.delivery-step .modal-body .steps-container .review .guaranteed .additional{
    border: 1px solid #d3d8df;
    border-radius: 10px;
    overflow: hidden;
    margin: 30px 0px 0px;
}
.delivery-step .modal-body .steps-container .review .guaranteed .additional p{
    text-align: center;
    font-size: 17px;
    text-transform: uppercase;
    font-weight: 500;
    background: #edf0f7;
    margin: 0;
    padding: 10px;
}
.delivery-step .modal-body .steps-container .review .guaranteed .additional .box{
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    padding: 25px;
}
.delivery-step .modal-body .steps-container .review .guaranteed .additional .box .txt{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.delivery-step .modal-body .steps-container .review .guaranteed .additional .box .txt img{
    height: 40px;
    width: 40px;
}
.delivery-step .modal-body .steps-container .review .guaranteed .additional .box .txt h2{
    font-size: 16px;
    font-weight: 600;
    color: var(--main-color);
    margin: 0;
    padding: 0;
    border: 0;
    line-height: 20px;
}
.delivery-step .modal-body .steps-container .review .guaranteed .additional .box .txt span{
    display: block;
    font-weight: 300;
    color: #777;
}
.delivery-step .modal-body .steps-container .review .guaranteed .additional .box i{
    font-size: 23px;
    color: var(--main-color);
}

.delivery-step .modal-body .steps-container .we-moving .total {
    border: 1px solid #e2e8ee;
    border-radius: 10px;
}

.delivery-step .modal-body .steps-container .we-moving .total p {
    text-align: center;
    background: #EDF0F7;
    padding: 15px 0px;
    font-size: 22px;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight: 600;
    color: #000;
}

.delivery-step .modal-body .steps-container .we-moving .total .item-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
}

.delivery-step .modal-body .steps-container .we-moving .total .item-box .txt {
    display: flex;
    align-items: center;
    gap: 25px;
}

.delivery-step .modal-body .steps-container .we-moving .total .item-box .txt h4 {
    font-size: 27px;
}

.delivery-step .modal-body .steps-container .we-moving .total .item-box .txt h5 {
    font-size: 26px;
    font-weight: 600;
    color: #616d80;
}

.delivery-step .modal-body .steps-container .we-moving .total .item-box .txt h4 span {
    font-size: 20px;
    color: #616d80;
}

.delivery-step .modal-body .steps-container .we-moving .total .item-box i {
    font-size: 40px;
    color: var(--main-color);
}

.delivery-step .modal-body .steps-container .we-moving .btn-item {
    text-align: center;
    margin: 50px 0px 40px;
}

.delivery-step .modal-body .steps-container .we-moving .btn-item .item {
    border: 0;
    background: transparent;
    font-size: 30px;
    font-weight: 600;
    color: var(--main-color);
    border: 2px solid #e2e8ee;
    padding: 20px 30px;
    border-radius: 13px;
    box-shadow: 0px 8px 0px #e2e8ee;
}


.delivery-step .modal-body .steps-container .tell-us .jersey {
    margin: 0px 0px 60px;
}

.delivery-step .modal-body .steps-container .tell-us .jersey h3 {
    font-size: 30px;
    margin: 0px 0px 35px;
    display: flex;
    align-items: self-start;
    justify-content: flex-start;
    gap: 15px;
    font-weight: 500;
}

.delivery-step .modal-body .steps-container .tell-us .jersey h3 img {
    height: 37px;
    width: 30px;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .group-input {
    display: flex;
    gap: 0px;
    margin: 0px 0px 25px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #bcbfc2;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .group-input .lable {
    font-size: 20px;
    font-weight: 400;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .group-input input {
    border: 0;
    padding: 12px 0px;
    font-size: 22px;
    text-align: end;
    font-weight: 600;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .group-input input::placeholder {
    font-size: 22px;
    font-weight: 600;
    color: var(--main-color);
}

.delivery-step .modal-body .steps-container .tell-us .jersey .purch h4 {
    font-size: 25px;
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 10px;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .purch h4 img {
    width: 25px;
    height: 25px;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .purch {
    border-bottom: 1px solid #bcbfc2;
    padding: 30px 0px;
    margin: 30px 0px;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .purch .purch-ratio {
    display: flex;
    align-items: center;
    gap: 20px;
    margin: 30px 0px 0px;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .purch .form-check-input {
    width: 35px;
    height: 35px;
    border: 3px solid #555;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .purch .form-check-label {
    font-size: 25px;
    font-weight: 600;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .flights {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #bcbfc2;
    padding: 20px 0px;
    /* border-top: 1px solid #bcbfc2; */
}

.delivery-step .modal-body .steps-container .tell-us .jersey .flights h6 {
    font-size: 23px;
    font-weight: 400;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .purch .form-check {
    display: flex;
    align-items: center;
    border: 2px solid #000;
    padding: 20px 40px;
    width: 100%;
    border-radius: 100px;
    height: 120px;
    justify-content: space-between;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .purch .form-check:focus {
    border-color: var(--main-color);
}

.delivery-step .modal-body .steps-container .tell-us .jersey .textare {
    margin: 40px 0px 0px;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .textare .parking {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0px 0px 20px;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .textare .parking h3 {
    font-size: 23px;
    font-weight: 400;
    margin: 0;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .textare .parking h6 {
    font-size: 25px;
    font-weight: 500;
    text-transform: capitalize;
    color: #555;
}

.delivery-step .modal-body .steps-container .tell-us .jersey .textare textarea {
    width: 100%;
    border-radius: 8px;
    padding: 10px 15px;
    font-size: 18px;
    color: #000;
}

.delivery-step .modal-body .steps-container .helper {
    display: flex;
    flex-direction: column;
    margin: 0px 0px 20px;
}

.delivery-step .modal-body .steps-container .helper .form-check {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 30px 0px;
    border-bottom: 1px solid #bcbfc2;
}

.delivery-step .modal-body .steps-container .helper .form-check label.form-check-label {
    font-size: 21px;
    font-family: "Poppins", sans-serif;
    color: #011631;
}

.delivery-step .modal-body .steps-container .helper .form-check .form-check-input {
    height: 30px;
    width: 30px;
    border: 2px solid var(--main-color);
    border-radius: 50%;
}
.delivery-step .modal-body .steps-container .where img {
    width: 235px;
    margin: 0px 0px 20px;
}

/* modal-step */



/* Overlay */
.delivery-step .modal-body .steps-container .where .popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(5px);
    /* blur effect */
    background: rgba(0, 0, 0, 0.3);
    /* slight dark overlay */
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 999;
}

/* Popup box */
.delivery-step .modal-body .steps-container .where .popup-box {
    background: white;
    padding: 40px 80px;
    border-radius: 10px;
    max-width: 960px;
    width: 90%;
    position: relative;
    animation: popupShow 0.3s ease-in-out;
    height: 500px;
}

/* Close button */
.delivery-step .modal-body .steps-container .where .popup-box .close-btn {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 23px;
    cursor: pointer;
    font-weight: 500;
    color: #616D80;
}

.delivery-step .modal-body .steps-container .where .popup-overlay .popup-box h3 {
    text-align: center;
    font-size: 25px;
    margin: 0px 0px 40px 0px;
    color: #616D80;
    text-transform: uppercase;
}

.delivery-step .modal-body .steps-container .main-input {
    position: relative;
    overflow: hidden;
    border: 1px solid #616D80;
    padding: 20px 25px;
    border-radius: 14px;
    box-shadow: 0px 5px 0px #616D80;
}

.delivery-step .modal-body .steps-container .main-input i {
    position: absolute;
    top: 34%;
    font-size: 25px;
    font-weight: 600;
    color: var(--main-color);
}

.delivery-step .modal-body .steps-container .input-search {
    border: 0;
    padding: 0px 0px 0px 45px;
    font-size: 23px;
    font-weight: 500;
    width: 100%;
}
.delivery-step .modal-body .steps-container .update-btn{
    text-align: center;
    margin: 75px 0px 0px;
}
.delivery-step .modal-body .steps-container .update-btn .update-location{
    border: 0;
    background: var(--main-color);
    color: #fff;
    padding: 15px 40px;
    border-radius: 50px;
    font-size: 16px;
}
.delivery-step .modal-body .steps-container .review .included .room-ul {
    flex-direction: row !important;
    justify-content: flex-start !important;
    margin: 22px 0px 0px;
}
.delivery-step .modal-body .steps-container .review .included .room-ul .choice-btn{
    font-size: 16px;
    font-weight: 500;
    color: #000;
    background: #fff;
    border: 1px solid var(--main-color);
    box-shadow: 0px 3px 0px var(--main-color);
    padding: 10px 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.delivery-step .modal-body .steps-container .review .included .room-ul .choice-btn.active{
    background: #eaefff;
    color: #3063ff;
}
.delivery-step .modal-body .steps-container .review .included .room-ul .choice-btn span {
    color: #006635;
    background: #d2f2ee;
    font-size: 12px;
    border-radius: 50%;
    height: 24px;
    width: 24px;
    align-items: center;
    justify-content: center;
    display: flex;
}
.sleeper {}

.sleeper .form-check {
    padding: 0;
    margin: 20px  0px !important;
}

.sleeper .form-check label.form-check-label {
    font-size: 16px !important;
    font-weight: 400 !important;
    font-family: "Poppins", sans-serif;
    color: #000;
}

.sleeper .form-check {}

.sleeper .form-check .form-check-input {
    height: 25px !important;
    width: 25px !important;
    border-radius: 50% !important;
}
.delivery-step .modal-body .steps-container .add-an-items .smoothly.required {
    background: #f5f8fc;
    border: 1px solid #e2e8ee;
}

.delivery-step .modal-body .steps-container .add-an-items .smoothly.required p {
    color: #253b54;
}
/* Animation */
@keyframes popupShow {
    0% {
        transform: scale(0.7);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}