/* @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap'); */
    
    body {
        font-family: 'Poppins', sans-serif;
    }
    
    .login-signup-body {
        /* background: linear-gradient(to top left, #F26DED66, #fff); */
        background: url(../images/BG.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }
    
    .mr-5 {
        margin-right: 10px;
    }
    
    .ml-5 {
        margin-left: 10px;
    }
    
    .flex-r,
    .flex-c {
        justify-content: center;
        align-items: center;
        display: flex;
        width: 500px;
    }
    
    .flex-c {
        flex-direction: column;
    }
    
    .flex-r {
        flex-direction: row;
    }
    
    .login-form {
        background: #FFFFFF;
        box-shadow: 33px -1px 103px rgba(234, 234, 234, 0.8);
        border-radius: 15px;
        max-width: 557px;
        min-height: 500px;
        width: 500px;
        border-radius: 10px;
        padding: 40px 40px;
        margin: 15px;
    }
    
    .logo {
        margin-bottom: 5px;
        text-align: center;
    }
    
    .login-form .login-heading {
        font-weight: 600;
        font-size: 24px;
        line-height: 39px;
        font-family: 'Poppins', sans-serif;
        /* identical to box height */
        text-align: center;
        color: #020223;
    }
    
    .login-form .login-subheading {
        font-family: 'Poppins', sans-serif;
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 27px;
        /* identical to box height */
        text-align: center;
        color: rgba(34, 34, 34, 0.71);
    }
    
    .login-section {
        height: 100vh;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .login-wrapper {
        display: flex;
        justify-content: center;
    }
    
    .form-login {
        align-items: flex-start !important;
        width: 100%;
        margin-top: 15px;
    }
    
    .form-signup {
        align-items: flex-start !important;
        width: 100%;
        margin-top: 15px;
    }
    
    .input-box {
        margin: 10px 0px;
        width: 100%;
    }
    
    .input-label {
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        color: #111928;
        margin-bottom: 3px;
    }
    
    .input {
        background-color: #F9FAFB;
        padding: 0px 5px;
        border: 1px solid #E5E7EB;
        border-radius: 10px;
        overflow: hidden;
        justify-content: flex-start;
        width: 100%;
    }
    
    .input-field {
        border: none;
        outline: none;
        padding: 16px 12px;
        background-color: #F9FAFB;
        flex: 1;
        color: #6B7280;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
    }
    
    .input i {
        color: rgba(0, 0, 0, 0.4);
    }
    
    .check span {
        color: #000000b2;
        font-size: 15px;
        font-weight: bold;
        margin-left: 5px;
    }
    
    .extra-line {
        font-size: 15px;
        font-weight: 600;
    }
    
    .extra-line a {
        color: #0095b6;
    }
    
    .google-btn {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        padding: 14px 24px 14px 23px;
        gap: 8px;
        border: 1px solid #111928;
        border-radius: 8px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        color: #111928;
        background-color: #fff;
        width: 100%;
    }
    
    .forgot-pwd {
        font-family: 'Poppins', sans-serif;
        font-style: normal;
        font-weight: 500;
        font-size: 14px;
        line-height: 150%;
        /* identical to box height, or 21px */
        color: #B600C2;
    }
    
    .login-btn {
        padding: 14px 23px 14px 24px;
        gap: 12px;
        background: #B600C2;
        border-radius: 8px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #FFFFFF;
        width: 164px;
        height: 52px;
        border: 1px solid #B600C2;
    }
    
    .login-btn:hover {
        background: #B600C2;
        color: #FFFFFF;
    }
    
    .horizontal-line {
        width: 100%;
        text-align: center;
        border-bottom: 1px solid rgba(107, 114, 128, 0.49);
        line-height: 0.1em;
        margin: 10px 0 20px;
    }
    
    .horizontal-line .or-line {
        background: #fff;
        padding: 0px 7px;
        font-size: 14px;
        color: #111928;
        font-weight: 500;
    }
    /*----------Sign Up---------*/
    
    .signup-form {
        background: #FFFFFF;
        box-shadow: 33px -1px 103px rgba(234, 234, 234, 0.8);
        border-radius: 15px;
        max-width: 557px;
        min-height: 500px;
        width: 500px;
        border-radius: 10px;
        padding: 40px 40px;
        margin: 15px;
    }
    
    .signup-form .signup-heading {
        font-weight: 600;
        font-size: 24px;
        line-height: 39px;
        font-family: 'Poppins', sans-serif;
        /* identical to box height */
        text-align: center;
        color: #020223;
    }
    
    .signup-form .signup-subheading {
        font-family: 'Poppins', sans-serif;
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 27px;
        /* identical to box height */
        text-align: center;
        color: rgba(34, 34, 34, 0.71);
    }
    
    .signup-section {
        height: 115vh;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .signup-wrapper {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .signup-btn {
        padding: 14px 23px 14px 24px;
        gap: 12px;
        background: #B600C2;
        border-radius: 8px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #FFFFFF;
        width: 164px;
        height: 52px;
        border: 1px solid #B600C2;
    }
    /*-----------Create Card-----------*/
    
    .card-section {
        display: flex;
        align-items: center;
        justify-content: center;
        /* height: 100vh; */
    }
    
    .user-name {
        font-weight: 600;
        font-size: 13px;
        line-height: 20px;
        /* identical to box height */
        color: #020223;
    }
    
    .vertical-line {
        border: 1px solid rgba(30, 32, 34, 0.72);
        transform: rotate(180deg);
        position: relative;
        top: -4px;
        display: flex;
        align-items: center;
    }
    
    .digital-card {
        background: #FFFFFF;
        box-shadow: 0px 27px 64px rgba(202, 208, 216, 0.4);
        border-radius: 15px;
        text-align: center;
        width: 479.34px;
        height: 552.78px;
        margin: auto;
        padding: 30px;
    }
    
    .user-card {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .card-heading {
        font-weight: 600;
        font-size: 26px;
        line-height: 39px;
        text-align: center;
        color: #020223;
    }
    
    .card-subheading {
        font-weight: 500;
        font-size: 14px;
        line-height: 165.5%;
        /* or 23px */
        text-align: center;
        color: #6B7280;
    }
    
    .create-card-btn {
        width: 195px;
        height: 52px;
        background: #B600C2;
        border-radius: 8px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #FFFFFF;
        border: 1px solid #B600C2;
    }
    
    .create-card-btn:hover {
        background: #B600C2 !important;
    }
    /*-----------Company Name-----------*/
    
    .bussiness-card {
        background: #FFFFFF;
        box-shadow: 0px 27px 64px rgba(202, 208, 216, 0.4);
        border-radius: 15px;
        text-align: center;
        width: 479.34px;
        height: 452.78px;
        margin: auto;
        padding: 30px;
    }
    
    .user-card {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .bussiness-heading {
        font-weight: 600;
        font-size: 26px;
        line-height: 39px;
        text-align: center;
        color: #020223;
    }
    
    .submit-next-btn {
        width: 195px;
        height: 52px;
        background: #B600C2;
        border-radius: 8px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #FFFFFF;
        border: 1px solid #B600C2;
    }
    
    .submit-next-btn:hover {
        background: #B600C2 !important;
    }
    
    .company-label {
        float: left;
        font-weight: 600;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        /* gray/900 */
        color: #111928;
    }
    
    .company-name-input {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        padding: 16px 20px;
        gap: 187px;
        background: #F9FAFB;
        border: 1px solid #E5E7EB;
        border-radius: 8px;
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        color: #6B7280;
    }
    /*----------Theme Select----------*/
    
    .theme-heading {
        display: flex;
        justify-content: center;
        font-weight: 600;
        font-size: 26px;
        line-height: 39px;
        /* identical to box height */
        text-align: center;
        color: #020223;
    }
    
    .theme-div {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .next-btn {
        width: 117px;
        height: 52px;
        background: #B600C2;
        border-radius: 8px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #FFFFFF;
        border: 1px solid #B600C2;
    }
    /*-------------Company Details------------*/
    
    .form-heading {
        font-weight: 600;
        font-size: 20px;
        line-height: 30px;
        /* identical to box height */
        color: #020223;
    }
    
    .divide-line {
        width: 2.333% !important;
        border-left: 1px solid #D6D6D6;
        height: auto;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .personal-input {
        background: #F9FAFB;
        /* gray/200 */
        border: 1px solid #E5E7EB;
        border-radius: 8px;
        height: 56px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #6B7280;
    }
    
    .personal-texarea {
        background: #F9FAFB !important;
        /* gray/200 */
        border: 1px solid #E5E7EB;
        border-radius: 8px;
        height: 101px;
    }
    
    .personal-label {
        font-weight: 600;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        /* gray/900 */
        color: #111928;
    }
    
    .upload-file-btn {
        border: 1px dashed #B600C2;
        border-radius: 8px;
        font-weight: 600;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #B600C2;
        padding: 16px 20px;
        width: 100%;
    }
    /*-----------Social Links-------------*/
    
    .add-link-btn {
        padding: 16px 20px;
        border: 1px solid #B600C2;
        border-radius: 8px;
        font-weight: 600;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #B600C2;
        float: right !important;
        width: 210px;
        height: 52px;
    }
    
    .link-input {
        display: flex;
        align-items: center;
    }
    
    .social-label {
        display: flex;
        align-items: center;
        font-weight: 600;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        /* gray/900 */
        color: #111928;
    }
    
    .social-input {
        background: #F9FAFB;
        /* gray/200 */
        border: 1px solid #E5E7EB;
        border-radius: 8px;
        height: 56px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #6B7280;
    }
    /*-----------Payment Details-----------------*/
    
    .payment-form-heading {
        font-weight: 600;
        font-size: 20px;
        line-height: 30px;
        /* identical to box height */
        color: #020223;
    }
    
    .payment-details {
        width: 500px;
        margin: 0 auto;
        align-items: flex-start !important;
        margin-top: 15px;
    }
    
    .upload-code-btn {
        border: 1px dashed #B600C2;
        border-radius: 8px;
        font-weight: 600;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #B600C2;
        padding: 16px 20px;
        width: 100%;
    }
    
    .payment-label {
        display: flex;
        align-items: center;
        font-weight: 600;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        /* gray/900 */
        color: #111928;
    }
    
    .payment-input {
        background: #F9FAFB;
        /* gray/200 */
        border: 1px solid #E5E7EB;
        border-radius: 8px;
        height: 56px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #6B7280;
    }
    /*------------Image Gallery--------------*/
    
    .add-image-btn {
        padding: 16px 20px;
        border: 1px solid #B600C2;
        border-radius: 8px;
        width: 100%;
        height: auto;
        font-weight: 600;
        font-size: 16px;
        line-height: 150%;
        color: #B600C2;
    }
    
    .complete-btn {
        width: 223px;
        height: 52px;
        background: #B600C2;
        border-radius: 8px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #FFFFFF;
        border: 1px solid #B600C2;
    }
    /*----------Product-Services-----------*/
    
    .product-card {
        height: 100%;
        background: #FFFFFF;
        box-shadow: 0px 27px 64px rgba(202, 208, 216, 0.4);
        border-radius: 13px;
        border: none;
    }
    
    .product-text {
        font-weight: 600;
        font-size: 17px;
        line-height: 150%;
        /* identical to box height, or 26px */
        /* gray/900 */
        color: #111928;
    }
    
    .product-subtext {
        font-weight: 400;
        font-size: 14px;
        line-height: 150%;
        /* or 21px */
        color: #6B7280;
    }
    
    .product-card2 {
        width: 206.02px;
        height: 100%;
        background: #FFFFFF;
        box-shadow: 0px 20.4017px 48.3595px rgba(202, 208, 216, 0.4);
        border-radius: 9.82302px;
        border: none;
    }
    
    .product-label {
        display: flex;
        align-items: center;
        font-weight: 600;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        /* gray/900 */
        color: #111928;
    }
    
    .product-input {
        background: #F9FAFB;
        /* gray/200 */
        border: 1px solid #E5E7EB;
        border-radius: 8px;
        height: 56px;
        font-weight: 500;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        color: #6B7280;
    }
    
    .product-textarea {
        height: 100px;
        background: #F9FAFB;
        /* gray/200 */
        border: 1px solid #E5E7EB;
        border-radius: 8px;
    }
    /*------------Product-services2---------*/
    
    .product-price {
        font-weight: 600;
        font-size: 24px;
        line-height: 36px;
        /* identical to box height */
        color: #B603C2;
    }
    
    .product-label2 {
        display: flex;
        align-items: center;
        font-weight: 600;
        font-size: 16px;
        line-height: 150%;
        /* identical to box height, or 24px */
        /* gray/900 */
        color: #111928;
    }
    
    .product-input2 {
        background: #F9FAFB;
        /* gray/200 */
        border: 1px solid #E5E7EB;
        border-radius: 8px;
        height: 56px;
    }
    
    .theme-width {
        width: 500px;
    }
    /*-----------Theme 1-----------*/
    
    .theme-one {
        background: #025052 !important;
    }
    
    .theme-one-banner {}